gpt4 book ai didi

javascript - AngularJs:将值传递给打开 ngDialog 的指令,然后更新值以反射(reflect)在根范围内

转载 作者:行者123 更新时间:2023-11-29 18:12:11 24 4
gpt4 key购买 nike

围绕这个进行了一段时间;基本上我有一个打开 ngDialog 的指令,这个指令需要能够从根范围获取一个变量。该指令基本上有一个单击事件,它打开一个 ngDialog 这个 ngDialog 然后使用传入的值并将其设置为文本框的文本...一旦 ngDialog 中的文本框被更新,它应该反射(reflect)根范围的变化。

我的问题传入的值未链接到根作用域,一旦值在 ngDialog 中更新,它就不会反射(reflect)回根作用域我很确定我只是犯了一个基本错误,任何人都可以伸出援手吗?

//HTML

<b>Instructions: </b>Click on the blue items to open ngDialog<br /><br />
<div ng-controller="MyCtrl">
<b>Base $scope.variable1 = </b> {{variable1}}
<span pass-object passed-object="variable1"></span><br />
<b>Base $scope.variable2 = </b> {{variable2}}
<span pass-object passed-object="variable2"></span><br />
<b>Base $scope.variable3 = </b> {{variable3}}
<span pass-object passed-object="variable3"></span><br />
</div>

//Js

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

myApp.controller('MyCtrl', function ($scope) {
//Lets say i have 3 scope variables
$scope.variable1 = "value 1";
$scope.variable2 = "value 2";
$scope.variable3 = "value 3";
});

//Now i want to create a directive that opens up a ngdialog, I need to be able to pass in a scope variable into this directive
//and from inside the ngDialog i need to be able to update the variable passed in, and have it reflect from the root scope.
myApp.directive('passObject', ['ngDialog', function(ngDialog) {
return {
restrict: 'A',
scope: { passedObject: '=' },
template: "<div class='directive'>This is the value passed into this directive = {{passedObject}}!</div>",
link: function($scope, element){
element.on('click',function(){
ngDialog.open({
template: '<div>By updating i need it to reflect in the root scope:<br /><br />' +
'<input type="text" ng-model="passedObject"/></div>',
plain: true,
scope: $scope,
controller: ['$scope', function($scope){
$scope.$watch('passedObject', function(passedObject){
//What do i need to do? it seems like the scope at this level is updating how come the parent is not?
alert('updated with: ' + passedObject);
$scope.$apply();
});
}]
})
});
}
};
}]);

// fiddle

http://jsfiddle.net/Egli/od8a2hL0/

//感激之情:D

提前致谢

最佳答案

控制台显示 $digest 已经在进行中,只需删除 $scope.$apply();

http://jsfiddle.net/usmoetyd/

你必须使用对象而不是原始类型:

myApp.controller('MyCtrl', function ($scope) {
//Lets say i have 3 scope variables
$scope.variable1 = { value : "value 1" };
$scope.variable2 = { value: "value 2" };
$scope.variable3 = { value: "value 3" };
});



//Now i want to create a directive that opens up a ngdialog, I need to be able to pass in a scope variable into this directive
//and from inside the ngDialog i need to be able to update the variable passed in from the root scope.
myApp.directive('passObject', ['ngDialog', function(ngDialog) {
return {
restrict: 'A',
scope: { passedObject: '=' },
template: "<div class='directive'>This is the value passed into this directive = {{passedObject.value}}!</div>",
link: function($scope, element){


element.on('click',function(){


ngDialog.open({
template: '<div>By updating i need it to reflect in the root scope:<br /><br />' +
'<input type="text" ng-model="passedObject.value"/></div>',
plain: true,
scope: $scope,
controller: ['$scope', function($scope){
$scope.$watch('passedObject', function(passedObject){
//What do i need to do? it seems like the scope at this level is updating how come the parent is not?
console.log(passedObject);
});

}]
})

});
}
};
}]);

http://jsfiddle.net/jyk6Lbwe/1/

阅读此问题以获得详细解释:What are the nuances of scope prototypal / prototypical inheritance in AngularJS?

关于javascript - AngularJs:将值传递给打开 ngDialog 的指令,然后更新值以反射(reflect)在根范围内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26375309/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com