5

ディレクティブの複数のインスタンスがあり、特定のインスタンスのみをターゲットにしたいと考えています。たとえば、以下のコードでは、 div がclass="one"event によってトリガーされる唯一のものであることを確認するにはどうすればよいですか$rootScope.$broadcast('myEvent')。

JS:

myApp.directive('myDirective', function() {
    return {
        restrict: 'A',
        controller: function(scope, el, attrs) {
            scope.$on('myEvent', function() {
                el.css({left: '+=100'});
            });
        },
    };    
});

HTML:

<div my-directive class="one"></div>
<div my-directive class="two"></div>
4

3 に答える 3

4

イベント ハンドラでこのチェックを行う必要があります。

myApp.directive('myDirective', function() {
  return {
    restrict: 'A',
      controller: function(scope, el, attrs) {
        scope.$on('myEvent', function(ev,args) {
          //do the check - you could provide a function, a value or something else
          if(el.hasClass(args.class)){
            el.css({left: '+=100'});
          }
        });
      },
  };    
});

次に、$broadcast にパラメーターを追加します。

$rootScope.$broadcast('myEvent',{class:'one'})
于 2013-04-26T07:07:07.377 に答える
1

$on のコールバック内で実行されるコールバックを参照する、このディレクティブの新しい属性を定義できます。

myApp.directive('myDirective', function() {
    return {
        restrict: 'A',
        scope: {
          callme: "="
        },
        controller: function(scope, el, attrs) {
            scope.$on('myEvent', function() {
                scope.callme(el)
            });
        },
    };    
});

HTML 宣言:

<div my-directive class="one" callme="functionDefinedInScope"></div>

Controller スコープで:

$scope.functionDefinedInScope = function(el) {
    el.css({left: '+=100'});
}

詳細については、http: //docs.angularjs.org/guide/directive (セクション「ディレクティブ定義オブジェクト」)を参照してください。

于 2013-04-26T07:22:36.357 に答える