Angularjs如何更新部分模板

Question

我想知道当我改变状态时如何使控制器功能工作。 这是我的 Angular 应用程序的主要模板：

<div>
    <div ng-include="'/navigation.html'"></div>
    <div>
        <!-- Page wrapper -->
        <div ng-include="'/topnavbar.html'"></div>
        <!-- Main view  -->
        <div ui-view></div>
        <!-- Footer -->
        <div ng-include="'/footer.html'"></div>
    </div>
</div>

在导航面板中我有 ng-repeat:

<ul ng-controller="NavigationCtrl" class="nav nav-second-level">
    <li ng-repeat="user in users" ui-sref-active="active">
       <a ui-sref="account">{{user.name}}</a>
    </li>
</ul>

因此，每当我更改状态时，我都想更新这个范围 var users。 我认为这是众所周知的问题，但我是 Angular 的新手，所以请帮助我。

Answer 1

嗯，我在这里看到了两种方法：

1) 监听状态事件，并做回调更新用户数据。文档在这里：https://github.com/angular-ui/ui-router/wiki#state-change-events

2）我假设用户数组来自服务，例如：

...
$http.get('/users', function(data){
  return data;
});
...

因此，您可以在服务中本地存储一个数组（这是单例），并从任何地方更新它，这样您就可以在“NavigationCtrl”中获得指向数组的链接，并且数据将是那里也更新了。

我的意思：

function UserService($http) {
  var users = []; //inital array
  var updateUsers = function() {
     //get to update users here
  };
  var getUsers = fucntion() {
    return users;
  }

  return {
    updateUsers : updateUsers, //this method will be called when you need to update user list
    getUsers : getUsers //this method will be called in NavigationCtrl
  }
}

更新：

这就是我在 pt.2 中的意思http://plnkr.co/edit/U2XwXNEqAxRrEa0VpYAu?p=preview