Sim*_*lla 2 angularjs angularjs-directive angularjs-scope
根据这个Plunkr,ng-init在一个指令中使用不会执行一个分配给内部链接范围的函数,但如果我在控制器中执行它.
有谁能解释一下?
app.js
var app = angular.module('app', []);
app.directive('linkDir', function(){
return {
restrict: 'E',
scope: true,
template: 'Link: <p ng-init="initLink()">{{ linkmsg }}</p>',
link: function(scope){
scope.initLink = function(){
scope.linkmsg = 'link function executed'
}
}
};
});
app.directive('controllerDir', function(){
return {
restrict: 'E',
scope: true,
template: 'Controller: <p ng-init="initController()">{{ controllermsg }}</p>',
controller: function($scope){
$scope.initController = function(){
$scope.controllermsg = 'controller function executed';
}
}
};
});
Run Code Online (Sandbox Code Playgroud)
HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="app">
<link-dir></link-dir>
<controller-dir></controller-dir>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
bml*_*ite 10
这与Angular指令的工作方式有关.scopeDOM元素和DOM元素之间的联系有点复杂,但是长话短说,如果使用控制器,scope将立即使用initController属性创建,而如果使用link属性,则只会填充范围之后它被链接到DOM元素(这意味着在期间initLink将是未定义的ng-init).
为了避免这些问题,请不要使用Angular文档中ngInit所述的指令:
ngInpe的唯一合适用途是用于别名ngRepeat的特殊属性,如下面的演示所示.除了这种情况,您应该使用控制器而不是ngInit来初始化作用域上的值.
如果你需要初始化属性,请坚持使用控制器scope.
| 归档时间: |
|
| 查看次数: |
7236 次 |
| 最近记录: |