如何使用AngularJS中的promises处理绑定到控件的数组?

时间:2017-04-12 11:54:36

标签: angularjs asynchronous promise

让我们假设我们在AngularJS中定义了一个组件。我们将其命名为UserList。该组件具有属性,因此控制器可以将一组用户传递给组件。

<user-list users="arrayOfUsers"></user-list>

用户列表的标记包含输入 - 列出用户的位置和按钮。在按钮上单击组件应该能够处理用户列表。

<div class="input-group">
    <input type="text" class="form-control" ng-model="$ctrl.users" />
    <span class="input-group-btn">
        <a class="btn btn-default" ng-click="$ctrl.process()">
            Process users
        </a>
    </span>
</div>

似乎是小菜一碟,但当用户处理需要调用Web服务和承诺时,情况并非如此。

如果我们只是迭代一组用户,并调用Web服务来处理用户,那么它将无法工作,因为结果不会立即返回,而是以异步方式执行。

this.userList.forEach(function (part, index, array) {
    var userName = array[index];
    UserService.processUser(userName).then(function (result) {
        array[index] = result; //not so easy...
    });
});

但实际上应该如何迭代数组以正确处理承诺呢?

0 个答案:

没有答案