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不起作用

回答

相關問題