描画 - link function angularjs




AngularJSディレクティブ:リンク関数とコンパイル関数は一緒に動作するようになっていますか? (2)

linkcompileは一緒に機能しません。

ディレクティブ定義オブジェクトでは、 link のみを定義すると、 preLink関数でコードとの空のpreLink関数を持つ空のcompile関数を持つようにpostLinkます。 compileを定義compileとすぐに、 linkはangleで無視されます。なぜなら、compileはリンク関数を返すべきだからです。

あなたがcompileから一つの関数を返すだけなら、それはリンクのに実行されます。

別のpostLinkば、 linkはスコープがcompileによってリンクされた後に呼び出されるpostLink関数のショートカットに過ぎません。

それはhere書かれています(コードのサンプルのコメントを見てください)。

私はこの機能についていくつかの疑問を持っています。

私はこの指令を持っていると言います:

.directive('hello', function () {
    return {
      template: '<div>Hello <span ng-transclude></span></div>',
      restrict: 'E',
      transclude: true,
      compile: function() {
        console.log('Compile()');

        return {
          pre: function() {
            console.log('PreLink()');
          },
          post: function() {
            console.log('PostLink()');
          }
        };
      },
      link: function postLink(scope, element, attrs) {
        console.log('Link()');
      }
    };
  }

私はそれをテンプレートに次のように追加します:

<hello>World</hello>

コンソールログ:

Compile()
PreLink()
PostLink()

link()が呼び出されないのはなぜですか?

compile()からオブジェクトを返す代わりに、コンソールに次のログを記録する単一の関数PreLink()を返しcompile()

Compile()
PreLink()

私がCompile()から何も返さなければ、コンソールログに次のように記録されます:

Compile()

Still link()が呼び出されていません。

私が単にCompile()コメントすると、 Link()が最後に表示されます:

Link()

誰かがこれをすべて説明できますか? Link()Compile()は一緒に作業することを意味しますか? 私は単にCompileのPreLink()PostLink()使うべきですか?


数日前、素晴らしい記事がJurgen Van de Moereによって「AngularJS指令の中のコンパイルとリンク関数の重要な部分」に掲載されました。 これは、 compilepre-link post-link機能の責任と順序についてはっきりと説明しています。

http://www.jvandemo.com/content/images/2014/Aug/cycle-2.png

間違いなくそれをチェックする必要がありhttp://www.jvandemo.com/the-nitty-gritty-of-compile-and-link-functions-inside-angularjs-directiveshttp://www.jvandemo.com/the-nitty-gritty-of-compile-and-link-functions-inside-angularjs-directives : http://www.jvandemo.com/the-nitty-gritty-of-compile-and-link-functions-inside-angularjs-directives





angularjs-directive