Angular ES6 控制器范围

Question

我想用两个 API 调用的结果创建一个对象并将其绑定到范围。到目前为止我有

export class MainController {
  constructor ($http) {
    'ngInject';

    this.$http = $http;
    this.getUsers();
    this.getPlayers();
  };

  getUsers() {
    this.$http.get('/api/users').then((resp) => {
      this.users = resp.data;
    })
  };

  getPlayers() {
    this.$http.get('/api/players').then((resp) => {
      this.players = resp.data;
    })
  };

}

我现在可以通过main.players 和main.users 访问视图中的用户和玩家。不过，我对范围感到非常困惑。我怎样才能等待两个承诺都解决，然后将变量绑定到范围？

我尝试了$q.all()，但我无法访问self.users 或self.players，即使我设置了var self = this;

Answer 1

你需要做的是要么使用ngRoute上的resolve在加载路由之前加载用户，要么使用$q.all等待所有内容加载并保持视图渲染：

export class MainController {
  constructor ($http, $q) {
    'ngInject';

    this.$http = $http;

    this.isDone = false;

    $q.all([this.getUsers(), this.getPlayers()]).then(() => this.isDone = true);
  };

  ...   
}

然后在视图侧使用ng-if="myCtrl.isDone"。