javascript - 如何在 angularjs 中使用 Controller 内部的 Promise?

标签 javascript angularjs

<分区>

我正在学习 angularjs 并尝试使用 Promise 将问候语附加到 h3 标签。但它不起作用(没有错误日志)。

angular.module('app', []).controller('test', function ($scope) {
  $scope.greeting = 'Hello world!';
  
  let p1 = new Promise(r => r('Hi'));  
  let p2 = new Promise(r => r('Im Gosu'));
  
  Promise.all([p1, p2]).then(p => {
    $scope.greeting = `${p[0]} ${p[1]}`;
    
    console.log(p[0]);
    console.log(p[1]);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="test">
  <h3 ng-bind="greeting"></h3>
</div>

我错过了什么?

最佳答案

Angular 需要知道您的 promise 已被解决以触发变更检测周期,重新评估 View 中使用的表达式 greeting,检测它已更改,并更新 DOM。

如果您使用 Angular $q 服务,那是自动的,因为每次解决 $q promise 时,$q Angular 服务都会触发更改检测。通过使用 native promise ,您可以在 Angular 背后更改模型的状态。

所以,要么使用 $q,要么了解你在做什么,并在你的回调函数末尾添加 $scope.$apply(),以通知 angular 你已经更改了模型.

关于javascript - 如何在 angularjs 中使用 Controller 内部的 Promise?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44355904/

相关文章:

javascript - 当 AngularJs 中数字输入非法时,为什么绑定(bind)到 null 不起作用

javascript - 组件 Angular 1.5 的 Angular Directive(指令)

angularjs - 如何使用 Protractor 来检查元素是否可见?

javascript - 如何在用户输入时显示提示框或工具提示?

javascript - 使用 lazysizes 延迟加载背景图像

java - 413 全头错误

javascript - 隐藏文件的文本框上传浏览按钮

jquery - 仅对某些操作执行 SetTimeout 或 $timeout

javascript - 匹配两个 ng-repeats 的对象属性

javascript - 来自数组的图表 js 自定义数据标签