无法获得ES6承诺值以在AngularJS视图中显示

Question

我正在尝试使用Pinterest JavaScript
SDK来获取项目的一些固定数据。我在创建的Pinterest服务中有一个方法，该方法在HomeController中被调用。我尝试将响应放入承诺中，以便将其放在HomeController上$scope并在视图中显示。但是，在我看来，$
scope.pins是未定义的。为什么呢undefined？似乎诺言正在奏效。还在学习承诺。

Pinterest服务

function getBoardPins (id) {
  return new Promise(function (resolve, reject) {
    PDK.request('/v1/boards/' + id + '/pins/', 'GET', {fields: 'id,link,url,creator,board,created_at,note,color,counts,media,attribution,image,metadata'}, function (response) {
      if (response) {
        resolve(response);
      }

      reject();
    });
  });
}

家庭控制器

Pinterest.getBoardPins('490329546869188172').then(function (response) {
  $scope.pins = response.data;
});

视图

<h1>Pinterest</h1>
<div ng-repeat="pin in pins">
  <div>{{pin}}</div>
</div>

Answer 1

使用$q.when的ES6承诺转换为AngularJS承诺：

$q.when(Pinterest.getBoardPins('490329546869188172'))
  .then(function (response) {
    $scope.pins = response.data;
});

AngularJS通过提供自己的事件处理循环来修改常规JavaScript流。这将JavaScript分为经典和AngularJS执行上下文。
只有在AngularJS执行上下文中应用的操作才能从AngularJS数据绑定， 异常处理，属性监视等中 受益 。

要将ES6承诺带入AngularJS执行上下文，请使用$q.when。

$ q.when

将可能是值或（第三方）之后可承诺的对象包装为$q承诺。当您处理的对象可能是或不是承诺时，或者承诺来自不可信任的来源时，此功能很有用。

— AngularJS $ q服务API参考-$
q.when

或者使用[$

q构造函数](https://docs.angularjs.org/api/ng/service/$q#-q-constructor)创建promise
。

function getBoardPins (id) {
  //return new Promise(function (resolve, reject) {
  return $q(function (resolve, reject) {
    PDK.request('/v1/boards/' + id + '/pins/', 'GET', {fields: 'id,link,url,creator,board,created_at,note,color,counts,media,attribution,image,metadata'}, function (response) {
      if (response) {
        resolve(response);
      }

      reject();
    });
  });
}

这创建了一个与AngularJS框架及其摘要周期集成的承诺。