6

これは単純であるべきだと思っていますが、何かが欠けています。flowObj以下の aをng-repeat自分のディレクティブに渡すにはどうすればよいですか? それをディレクティブに渡し、クリックしてそれを使用しFlowObj、いくつかのロジックを適用します。ディレクティブでコメント付きのコードを使用してみました

scope: { 
    test:"@" 
}

しかし、それは私のCSSを台無しにしているようです。

HTML:

<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   </head>
   <body>
      <div id="center_outer">
         <div id="center_inner" ng-controller="CtrlPageFlow">
            <div flowclick class="cflow" ng-repeat="flowObj in flows">
               {{flowObj.name}}
            </div>
         </div>
      </div>
   </body>
</html>

これが私の指示です

angular.module('directives', ['opsimut']).directive('flowclick', function() {
    return {   
        /* 
        scope: {
            test:"@"   // set the attribute name on the directive's scope
        },
        */
        link: function(scope, elem, attr) {
            elem.bind('click', function(scope) {
                debugger;
                alert(scope.flowObj);
                //scope.name += '!';
                //scope.$apply();
            });
        }
    };
});

回答に基づく解決策:

angular.module('directives', ['opsimut']).
directive('flowclick', function() {
  return {
    link: function(e, elem, attr) {
      // scope is the directive's scope,
      // elem is a jquery lite (or jquery full) object for the directive root element.
      // attr is a dictionary of attributes on the directive element.
      elem.bind('click', function(e1) {
        debugger;
        alert(e.flowObj);
      }, e);
    }
  };
});
4

1 に答える 1