Question

在角度方面需要一些帮助。我有一个指令，我想在链接功能上获得控制器：

 link : function (scope, element, attr, ctrl) {
//DO Something
}

显然这是一项简单的任务，如果我像这里预定义“ng-model”那样它确实有效：

<numric ng-model="data.mytext" />

但我想使用numric作为属性并从中获取模型：

<div numric ="data.mytext" ></div>

现在当我到达链接函数ctrl时为空。我的代码：

 <html lang="en">
<head>
  <meta charset="utf-8">
  <title>Angular JS demo</title>
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="firsttimeCtrl">
    <div numric="data.mytext" />
</div>

</body>
<script type="text/javascript">

var myapp=angular.module('myApp',[]);

myapp.controller('firsttimeCtrl',function ($scope) {
       //$scope.data=Data;

    });


myapp.directive('numric', function() {
  return {    
    require: '?ngModel',
    replace: true,

    link:function (scope, element, attr, ctrl) {

      function numricAddCommas(text){
      var str = text.replace(/[^0-9]/g, '');//allowing only numbers
        var parts = (str + "").split("."),
            main = parts[0],
            len = main.length,
            output = "",
            i = len - 1;

        while(i >= 0) {
            output = main.charAt(i) + output;
            if ((len - i) % 3 === 0 && i > 0) {
                output = "," + output;
            }
            --i;
        }
        // put decimal part back
        if (parts.length > 1) {
            output += "." + parts[1];
        }
        if(output !== text) {
            str=output;
            ctrl.$setViewValue(output);
            ctrl.$render();
        }
        return output;

    }

        ctrl.$parsers.push(numricAddCommas);
    },
    template:'<input type="text" />'


  }; 
});
</script>
</html>

有一种方法可以通过模板知道我在哪个控制器？还是有另一种方式？感谢。

Answer 1

您的指令应声明范围：

.directive("...",function(....){
return {
scope:{
input:"=",
},
link:function(scope,element,attrs){
//access the input as scope.input
}

};
});

并使用它：

<div directive-name input="var_name_on_scope"></div>

您可能还想阅读此问题： What is the difference between '@' and '=' in directive scope in AngularJS?

AngularJS - 指令不获取控制器数据

1 个答案: