當指令更新相同的作用域變量時，不更新角度父作用域
[英]Angular parent scope not updated when directive updates the same scope variable
問題描述
我寫了一條指令來驗證某些綁定值並在對按鈕執行操作之前對其進行修改。 但是指令值的任何值更新都不會反映在父作用域中。 我在指令中使用了（=），所以我的假設是它也會更新父作用域。
讓我知道我在做什么錯。 已附上圖像。
在此視圖中，父項和指令共享相同的文本值。
分配給驗證文本的結果值未反映在父選定節點中。 當執行ok功能時。
我確實看到該值在文本區域中得到更新。 但是不知道為什么在執行ok函數時不更新它。
我在scope.ngClick上嘗試了$ timeout，$ evalAsync，但沒有成功。
2 個解決方案
解決方案1
1 已采納 2014-04-11 21:12:54
在自定義指令的元素的事件處理程序中進行的更改不會觸發Angular的摘要周期。 因此，您需要通知Angular范圍已更改（通過調用scope.$digest()或scope.$apply() ）。 我注意到的另一件事是，方法ok()被調用了兩次：一次在Angular的ngClick指令中，第二次在您的指令中。 如果這不是您想要的行為，請將其從您的指令中刪除。 這是一些工作代碼：
HTML
<body ng-controller="myController">
<textarea ng-model="selected.note"></textarea>
<button type="button" validatetext="selected.note" ng-click="ok()">Click Me!</button>
</body>
JavaScript的
angular.module('online-desktop', []).
controller('myController', ['$scope', function($scope) {
$scope.selected = {
note: 'old value'
};
$scope.ok = function() {
alert($scope.selected.note);
};
}]).
directive('validatetext', [function() {
return {
scope: {
validatetext: '='
},
link: function(scope, element, attr) {
element.on('click', function() {
scope.$apply(function() { // <= change scope properties inside scope.$apply()
scope.validatetext = 'some new value';
});
});
}
}
}]);
柱塞： http ://plnkr.co/edit/rmJVBzjIeiVcoQUV79z2?p=preview
解決方案2
0 2014-04-11 20:54:33
我建議您嘗試使用指令中的$ rootScope。$ broadcast並使用$ scope。$ on將其捕獲到父級中
//directive
$rootScope.$broadcast("valueUpdated", result);
//parent
$scope.$on("valueUpdated", function(event, result){
//update the value here
});
您也可以使用$ scope。$ emit代替$ rootScope。$ broadcast。
Directive鏈接中的作用域變量未更新為Directive Controller使用Angular讀取它時
[英]Scope variable in Directive Link is not updated to when Directive Controller reads it using Angular
Angular - 將范圍值保存到變量，但在范圍更新時不更新它
[英]Angular - save scope value to variable, but not update it when scope updates
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.