37

compileanglejsのディレクティブの関数には、との2つの関数がpreLinkありpostLinkます。

プレリンク機能

子要素がリンクされる前に実行されます。コンパイラのリンク関数がリンク用の正しい要素を見つけることができないため、DOM変換を行うのは安全ではありません。

ポストリンク機能

子要素がリンクされた後に実行されます。ポストリンク機能でDOM変換を行っても安全です。

それは私たちが何をすべきでないかを教えてくれますpreLink、私は何をいつ使うべきか疑問に思いますpreLinkか？ほとんどの場合、私はちょうど使用しpostLinkました。使わなければならない場合はありますか？

4

3 に答える 3

13

ほとんど使用する必要はありませんpreLink。実行可能なケースは、関数 (他のディレクティブも) が実行される前に、スコープ内でデータを操作する必要があるが、 DOMでは操作する必要がない場合です。 link

ジェイコブがコメントしたように、コントローラーからいつでもそれを行うことができますが、ディレクティブ自体にコードを含める方が適切な場合があります。

リンク順序がよく説明されているディレクティブがどのように機能するかについての優れた記事があります。

事前リンクが必要な場合がある理由の良い例が必要な場合は、angular ディレクティブ自体のコードを確認することをお勧めします。例https://github.com/angular/angular.js/blob/master/src/ng/directive/ngModel.js

于 2013-04-29T11:40:13.757 に答える
6

他のディレクティブを含むカスタム ディレクティブを作成するときは、preLink を使用する必要がありました。私の場合、ディレクティブには、Angular UI Bootstrap の Typeahead ディレクティブをその要素の一部に適用し、独自のスコープ変数を使用して Typeahead 機能を初期化するテンプレートが含まれていました。

例えば：

...
template:
    "<select ng-show='dropdown' class='form-control' ng-model='ngModel' ng-options='s for s in suggestions'></select>"
    + "<textarea ng-show='!dropdown' class='form-control' ng-model='ngModel' typeahead='s for s in suggestions |filter:$viewValue' typeahead-min-length='0' typeahead-editable='{{editable}}'></textarea>",
...

その場合、Angular は親ディレクティブの前に子ディレクティブをリンクするため、preLink を使用して先行入力をセットアップする必要がありました。ディレクティブの postLink 関数で $scope.dropdown 変数と $scope.editable 変数を初期化したところ、先行入力ディレクティブがリンクされたときにそれらが初期化されていないことがわかりました。このディレクティブを正しく機能させるには、それらの初期化を preLink に移動する必要がありました。

于 2013-09-20T13:12:44.470 に答える