AngularJS承诺在下一次用户交互之前不会更新GUI

Question

我在AngularJS中使用Angular2风格的组件。在我的组件中，我有一个功能，它旨在通过更改下拉菜单的选项来更新GUI：

var ctrl = this;
async function updateOptions(node) {
var name = node.name;
let result = await MyService.getResult(name);
ctrl.options = result;
console.log(ctrl.options); 
}

显示这些选项的相应HTML是：

<select ng-if="$ctrl.getType() === 'dropdown'"
class="form-control selectList"
ng-model="$ctrl.value"
ng-options="option.key as option.displayName for option in $ctrl.options">
</select>

其中CCD_ 1总是返回CCD_。

下拉列表以空白开始。用户从下拉列表中选择一个选项。控制台会正确记录选项和下拉列表更新。用户从下拉列表中选择另一个选项。控制台再次正确记录选项。但这一次，下拉列表不会更新。在接下来的所有时间里，下拉列表显示用户选择的PREVIOUS选项。

期待一些好的侦探工作。很高兴从这个大型项目中提供更多的代码片段。我想知道这是否是AngularJS更新方式的问题。

更新：

MyService代码：

this.getResult = function(name) {
return myFactory.getStuff(name).then(
function(response) {
return response.result.map(...);
}
);
};

MyFactory代码：

myFactory.getStuff = function(name) {
return $http.get('/url/here/' + name)).then(
function(response) {
return response.data;
}
);
};

Answer 1

await适用于浏览器支持的本机承诺。您还可以在本机promise上使用.then语法。

但是AngularJS使用来自$q服务的自己的承诺。因此，您需要使用.then语法，因为浏览器不知道这些承诺。

当您使用来自$q服务的promise时(例如，当您使用$http时(，您不必担心摘要周期，因为当promise实现时，会为您运行摘要。但是，如果您在AngularJS中使用本机promise，您通常必须手动运行摘要循环。