Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/25.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript AngularJs:将值传递给打开ngDialog的指令,然后将值更新回根范围_Javascript_Angularjs_Ng Dialog - Fatal编程技术网

Javascript AngularJs:将值传递给打开ngDialog的指令,然后将值更新回根范围

Javascript AngularJs:将值传递给打开ngDialog的指令,然后将值更新回根范围,javascript,angularjs,ng-dialog,Javascript,Angularjs,Ng Dialog,这件事已经有一段时间了;基本上我有一个打开ngDialog的指令,这个指令需要能够从根范围中获取一个变量。 该指令基本上有一个单击事件,打开一个ngDialog。该ngDialog然后使用传入的值并将其设置为 文本框的文本。。。更新ngDialog中的文本框后,它应反映根范围上的更改 我的问题 传入的值未链接到根作用域,一旦该值在ngDialog中更新,它不会反映回根作用域 我很确定我犯了一个基本的错误谁能帮我一把吗 //Html <b>Instructions: </b>

这件事已经有一段时间了;基本上我有一个打开ngDialog的指令,这个指令需要能够从根范围中获取一个变量。 该指令基本上有一个单击事件,打开一个ngDialog。该ngDialog然后使用传入的值并将其设置为 文本框的文本。。。更新ngDialog中的文本框后,它应反映根范围上的更改

我的问题 传入的值未链接到根作用域,一旦该值在ngDialog中更新,它不会反映回根作用域 我很确定我犯了一个基本的错误谁能帮我一把吗

//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>
说明:单击蓝色项目打开ngDialog

基本$scope.variable1={{variable1}
基本$scope.variable2={{variable2}
基本$scope.variable3={{variable3}
//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();
                        });
                    }]
                })
            });
        }
    };
}]);
var myApp=angular.module('myApp',['ngDialog']);
myApp.controller('MyCtrl',函数($scope){
//假设我有3个范围变量
$scope.variable1=“值1”;
$scope.variable2=“值2”;
$scope.variable3=“值3”;
});
//现在我想创建一个打开ngdialog的指令,我需要能够将一个范围变量传递到这个指令中
//在ngDialog中,我需要能够更新传入的变量,并使其从根范围反映出来。
myApp.directive('passObject',['ngDialog',函数(ngDialog){
返回{
限制:“A”,
作用域:{passedObject:'='},
模板:“这是传递到此指令的值={{passedObject}}!”,
链接:功能($scope,element){
元素上('click',function()){
ngDialog.open({
模板:“通过更新,我需要它反映在根作用域中:

” '', 朴素:没错, 范围:$scope, 控制器:['$scope',函数($scope){ $scope.$watch('passedObject',函数(passedObject){ //我需要做什么?这一级别的范围似乎正在更新,为什么父级没有更新? 警报('更新为:'+passedObject); $scope.$apply(); }); }] }) }); } }; }]);
//小提琴

//感激 :D


感谢高级

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

必须使用对象而不是基本类型:

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);                                
                        });

                    }]
                })

            });
        }
    };
}]);
myApp.controller('MyCtrl',函数($scope){
//假设我有3个范围变量
$scope.variable1={value:“value 1”};
$scope.variable2={value:“value 2”};
$scope.variable3={value:“value 3”};
});
//现在我想创建一个打开ngdialog的指令,我需要能够将一个范围变量传递到这个指令中
//在ngDialog中,我需要能够更新从根作用域传入的变量。
myApp.directive('passObject',['ngDialog',函数(ngDialog){
返回{
限制:“A”,
作用域:{passedObject:'='},
模板:“这是传递到此指令的值={{passedObject.value}}!”,
链接:函数($scope,element){
在('click',function(){
ngDialog.open({
模板:“通过更新,我需要它反映在根作用域中:

” '', 朴素:没错, 范围:$scope, 控制器:['$scope',函数($scope){ $scope.$watch('passedObject',函数(passedObject){ //我需要做什么?这一级别的范围似乎正在更新,为什么父级没有更新? console.log(passedObject); }); }] }) }); } }; }]);


阅读此问题以获得详细解释:

我建议使用console.log()而不是alert进行调试。。。这只是一个例子,谢谢你的点评,这是因为$scope.$apply()是多余的,我在绝望的时候评论了这个,我添加了这个…:)伙计,你是一个传奇!谢谢你解决这个问题,谢谢你的链接,非常有用的干杯!