我对指令的访问数据感到困惑,特别是当我定义了我的模型时,例如:
vm = this;
vm.myModel = "hello";
我的指令:
function mySelectedAccount(){
return {
restrict: 'A',
link: function(scope, element, attrs) {
element.on('click', function() {
console.log(scope.myModel);
});
}
}
}
由于我没有使用 $scope,如何跨指令访问 Controller 内定义的“myModel”?如果我尝试使用 scope< 访问它/em> 我的指令中的参数未定义。
感谢您的宝贵时间
最佳答案
在这里,您的 vm
变量指的是您的 Controller 实例。在您的作用域中,您将 Controller 上下文注册到 vm
变量中。
所以你可以这样做:
Controller
(function(){
function Controller($scope) {
var vm = this;
vm.myModel = 'toto';
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
指令
(function(){
function directive() {
return {
link:function(scope, element, attrs){
element.on('click', function() {
//Access to vm property wrap into the scope
console.log(scope.vm.myModel);
});
}
};
}
angular
.module('app')
.directive('directive', directive);
})();
然后在您的 html 中,您可以使用 controllerAs 语法:
HTML
<body ng-app='app' ng-controller="ctrl as vm">
<div directive>{{vm.myModel}}</div>
</body>
您可以在这里看到Working Plunker
关于javascript - 如何使用 "this"定义的指令访问模型的数据 Controller 内部指令?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32230422/