角度视图不从模型更改更新

时间:2013-10-01 13:35:24

标签: angularjs angularjs-model

我有两个使用相同控制器的模态。一个人有:

    <div id="addToPlaylist" ng-controller="PlaylistModalCtrl">
                    <select name="playlist" ng-model="playlist" ng-options="playlist.id as playlist.name|rmExt for playlist in playlists">
                    </select>

另一个有:

<div id="newPlaylist" ng-controller="PlaylistModalCtrl">
<button ng-click="createPlaylist(playlistName);">Save</button>

在我的控制器中,我有:

angular.module('MyApp')
  .controller('PlaylistModalCtrl', function ($scope) {
    $scope.playlists = [];

    $scope.updatePlaylists = function() {
      getPlaylist.then(function (response) {
        $scope.playlists = response.data.data;
        $scope.$$phase || $scope.$apply();
      });      
    }

    $scope.createPlaylist = function(playlist_name) {
      addPlaylist(playlist_name).then(function(response) {
        $("#newPlaylist").modal('hide');
      });
    }

    $scope.updatePlaylists();
  });

所以我们可以预期我的第一个视图会在下拉列表中显示更新的“播放列表”,但事实并非如此。那么我该如何才能更新该视图呢?

1 个答案:

答案 0 :(得分:1)

您似乎不了解范围界定的工作原理。这是一个插图,说明两个不同的控制器有不同的范围和东西。

http://plnkr.co/edit/LqLuLvVkE9ltzcJH6XdN?p=preview

正如您可以清楚地看到的那样,期望两个控制器更新同一个变量是行不通的,因为每个控制器都有自己隔离范围内的变量。你可以做的就是实现一个pubsub服务来监听某些属性的某些变化,使用emit和broadcast角度函数,或者最好,重新考虑为什么你需要在你的应用程序中使用相同的控制器两次并重新设计它。