0

transcludeオプションがtrueに設定された、分離されたスコープを持つディレクティブとして、単純な再利用可能なコレクションコンテナを作成しました。

app.directive('itemWrapper', function() {
  return {
    template: '...',
    replace: true,
    transclude: true,
    restrict: 'E',
    scope: {
      name: '=',
      isExpanded: '='
    }
  };

});

そして、リスト項目のクリックを処理するコントローラーから関数を渡したいリスト ビュー ディレクティブ

app.directive('listItem', function() {
      return {
        template: '...',
        replace: true,
        restrict: 'E',
        scope: {
          item: '=',
          action: '&'
        },
        link: function(scope, elm, attrs){
          scope.performAction = function(val){
            action({'data': val});
          };
        }
      };
});

私のHTMLのチャンクは次のようになります。

<collection-wrapper name='item.name' is-expanded='item.visible'>
  <list-item item='item' action='log(data)'></list-item>
</collection-wrapper>

actionしかし、リンクをクリックすると、定義されていないという参照エラーが表示されます。問題は、コントローラーからこのディレクティブに関数を渡す方法です。私が理解しているように、transcluded スコープは独立したスコープの子であり、これは私が乗り越えられなかった障害です!

これがPlunkrです。

4

2 に答える 2

1

actionスコープ上のメソッドです。あなたは言う必要があります：

scope.action({'data': val});

http://plnkr.co/edit/gt6BgCpZ9qmOEJ8yS4UD?p=preview

于 2015-05-05T12:38:35.700 に答える
0

あなたによると、「コントローラーから関数を渡すということは、コントローラーから関数を開始することを意味しますか、それともトランスクルージョンされたコンテンツ内から関数をトリガーすることを望みますか??

于 2015-05-05T12:32:29.640 に答える