2013-08-20 4 views
31

...オブジェクトの返り値とディレクティブ定義の関数の違いは? <em>ディレクティブ定義オブジェクト</em>を(私はそれが呼ばれると思う..?)を使用して(ウィジェット宇野で)次のコードの間の機能の違いは何ですか

angular.module("app"). 
    directive("widgetUno", ["$http", function ($http) { 
     return { 
       // A whole bunch of crap going on here 
      }, 
      templateUrl: "widgetUno.html" 
     }; 
    }]); 

...ウィジェットでこのコードドス?

angular.module("app").directive('widgetDos', function($http) { 
    return function(scope, element, attrs) { 
     // A whole bunch of crap going on here 
    }; 
}); 

私はウィジェットドスにウィジェット宇野ようなものだディレクティブを変換しようとしているが、私はtemplateUrlどこを参照していますか?これはWidget Dosでも可能ですか?

答えて

42

ディレクティブ内の関数のみを返すことは、完全定義のlink関数の省略形です。

あなたはlink機能(のようなtemplateUrl)以外の何かを指定している場合、あなたはそれを長い道のり記述する必要があります。この違いを

angular.module("app"). 
    directive("widgetUno", ["$http", function ($http) { 
     return { 
      link: function(scope, element, attrs) { 
      // A whole bunch of crap going on here 
      }, 
      templateUrl: "widgetUno.html" 
     }; 
    }]); 

は、実際にここに文書化されている - http://docs.angularjs.org/guide/directive

1

それは次のように動作するはずです:

angular.module("app").directive('widgetDos', function($http) { 
    return { 
     templateUrl: "....", 
     link: function(scope, element, attrs) { 
      // A whole bunch of crap going on here 
     }; 
    } 
}); 

http://docs.angularjs.org/guide/directive(ロングバージョン)を参照してください。例があります。

8

関数を返す関数は、実際には次のショートカットです。

angular.module("app").directive('widgetDos', function($http) { 
    return { 
     link: function(scope, element, attrs) { 
      //... 
     }; 
    } 
}); 

ディレクティブにテンプレート、コントローラなどが必要ない場合に使用します。それ以外は、2つの呼び出し方法の間に機能的な違いはありません。

関連する問題