fan*_*nly 5 angularjs angularjs-directive angularjs-scope
我编写了一个需要更新父作用域的angular指令.
angular.module('app').directive('googlePlace', function () {
return {
restrict: 'A',
require: 'ngModel',
link: function ($scope, element, attributes, model) {
$scope.property1 = 'some val';
$scope.property2 = 'another val';
$scope.$apply();
};
});
Run Code Online (Sandbox Code Playgroud)
但在我的控制器中我这样做:
MyCtrl = function($scope){
$scope.doSave = function(){
// do some logic
console.log($scope.property1);
console.log($scope.property2);
}
Run Code Online (Sandbox Code Playgroud)
}
当doSave运行时,我在我的控制台得到未定义的值.如何在不隔离范围的情况下将其应用于父节点范围.我没有此选项,因为同一元素上的另一个指令隔离了作用域.
小智 3
它应该有效。默认情况下,如果您未在指令中指定作用域,它将使用父作用域,因此应设置 property1 和 property2。尝试将指令中的范围设置为 false。作为旁注,这并不是您正在做的事情的好习惯。最好隔离范围并将属性添加为属性。这样你就会有很好的封装。
例如
angular.module('app').directive('googlePlace', function () {
return {
restrict: 'A',
require: 'ngModel',
scope: {
property1: '=',
property2: '='
}
link: function ($scope, element, attributes, model) {
//here you have access to property 1 and 2
};
});
function MyCtrl($scope) {
$scope.property1 = null;
$scope.property2 = null;
$scope.doSave = function(){
// do some logic
console.log($scope.property1);
console.log($scope.property2);
}
}
Run Code Online (Sandbox Code Playgroud)
还有你的html
<div ng-control="MyCtrl">
<div google-place property1='property1' property2='property2'></div>
</div>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
3980 次 |
| 最近记录: |