AngularJS：$ on不起作用

我想使用AngularJS在模态窗口中编辑用户名，但是，在我使用第二个控制器的“update（）”函数后，名称保持不变。 $scope.closeThisDialog();工作正常。我的$on和$emit有什么问题？

我的服务：

'use strict'; 
    var myService = function() { 
     var user = { name: "Peter", surname: "Pitt"}; 
     var service = {}; 
     service.user = user; 
     return service; 
    }; 
    module.exports = [myService];

第一控制器：

'use strict'; 
    var FirstController = function ($scope, myService, ngDialog) { 
     $scope.user = myService.user; 
     $scope.openModal = function() { 
      ngDialog.open({templateUrl: 'myTemplate'}); 
     }; 
     $scope.$on("updateUser", function(event, data){ 
      $scope.user = data; 
     }); 
    }; 
    module.exports = ['$scope', 'myService', 'ngDialog', FirstController];

第二个控制器：

'use strict'; 
var SecondController = function ($scope, myService, ngDialog) { 
    $scope.editedUser = angular.copy(myService.user); 
    $scope.update = function() { 
      $scope.$emit("updateUser", $scope.editedUser); 
      $scope.closeThisDialog(); 
     }; 
    };  
    module.exports = ['$scope', 'myService', 'ngDialog', SecondController];

索引文件：

<html> 
<body ng-app=""> 
    <div ng-controller="FirstController"> 
     <a ng-click="openModal()">Edit</a> 
     Name: {{user.name}} </br> 
     Surname: {{user.surname}} 
    </div> 
</body> 
</html>

和模态窗口：

<script type="text/ng-template" id="edit"> 
    <form ng-controller="SecondController"> 
     <input ng-model="editedUser.name"> 
     <input ng-model="editedUser.surname"> 
     <button ng-click="update()">Submit</button> 
    </form> 
</script>

来源

2015-03-31 limpo

需要看看你如何把这个控制器放在HTML中？或者他们在不同的页面上？ – 2015-03-31 18:57:22

是的，请显示HTML。 – SoluableNonagon 2015-03-31 18:58:27

我想你可以试试从$ rootScope $广播而不是从子范围发出$。 – SoluableNonagon 2015-03-31 19:00:01

看起来您需要将$范围传递到ngDialog.open，这样您就可以在相同范围内发声了o N：

ngDialog.open({ template: 'myTemplate', scope: $scope });

当然

，因为你现在共享相同的范围，你就应该能够直接在模式编辑$scope.user又懒得光/监听事件在所有;）

来源

2015-03-31 19:49:11 pherris

这是因为$emit仅Echo的事件了作用域链。所以你的第一个控制器只会听到你的第二个控制器的范围是父母（或父母的父母等）。

为了让活动顺利进行，您必须在您的第一个控制器中使用$rootScope.$on（捕获所有内容）或$rootScope.$broadcast（将事件发送给每个子范围）。

来源

2015-03-31 19:36:52

你也可以做到这一点不使用$发出和$播放，如果你只是希望数据在FirstController用

$scope.update = function() { 
     angular.copy($scope.editedUser,myService.user); 
     $scope.closeThisDialog(); 
    }; 
});

更换

$scope.update = function() { 
     $scope.$emit("updateUser", $scope.editedUser); 
     $scope.closeThisDialog(); 
    }; 
};

你可以看到一个更新工作小提琴here

来源

2015-03-31 19:42:20 Martin

AngularJS：$ on不起作用

回答

相关问题