来自 ES6 承诺的数据在我点击它之前不会呈现在页面上? [英] Data from ES6 promise doesn't render on the page until I click on it?

问题描述

我将 Ionic 用于我的应用，并连接到 Firebase 以提取数据.我在工厂中创建了一个将数据下拉的承诺，并认为它应该在完成后将数据呈现在屏幕上，但在我触摸屏幕之前我什么也没有得到?

I an using Ionic for my app with a connection to Firebase to pull data. I created a promise in a factory to pull data down and thought it should render the data on the screen once it finishes but I'm getting nothing until I touch the screen?

我没有发现任何错误，数据确实来了.

I get no error and the data does indeed come.

工厂:

all: function () {
          return new Promise ((resolve, reject) => {
            firebase.database().ref('desks').once('value').then(snapshot => {
              let desks = [] 
              snapshot.forEach((child) => {
                desks.push(child.val());
              });
              resolve(desks)
            });
          });

}

致电工厂:

Office.all().then(function (data) {
    console.log(data);
    $scope.officeList = data;
});

我觉得我说错了，否则有一种我似乎找不到的 Ionic 方法.

I feel I'm calling it wrong or else there is an Ionic method that I can't seem to find.

一旦完成请求，我将如何呈现数据?

How will I be able to have the data render once it finishes the request?

提前致谢

推荐答案

ES6 承诺未与 AngularJS 框架集成.使用 $q.when 将 ES6 承诺转换为 AngularJS 承诺.只有在 AngularJS 执行上下文中应用的操作才能受益于 AngularJS 数据绑定、异常处理、属性监视等.

ES6 promises are not integrated with the AngularJS framework. Use $q.when to convert ES6 promises to AngularJS promises. Only operations which are applied in the AngularJS execution context will benefit from AngularJS data-binding, exception handling, property watching, etc.

all: function () {

      ̶r̶e̶t̶u̶r̶n̶ ̶n̶e̶w̶ ̶P̶r̶o̶m̶i̶s̶e̶ ̶(̶(̶r̶e̶s̶o̶l̶v̶e̶,̶ ̶r̶e̶j̶e̶c̶t̶)̶ ̶=̶>̶ ̶{̶        
    var es6promise = firebase.database()
      .ref('desks').once('value')
      .then(snapshot => {
          let desks = [] 
          snapshot.forEach((child) => {
            desks.push(child.val());
          });
          ̶r̶e̶s̶o̶l̶v̶e̶(̶d̶e̶s̶k̶s̶)̶
          return desks;
    });

    return $q.when(es6promise);
}

还要避免使用 Promise(resolve,reject 来创建新的承诺.而是使用 .then 方法.它返回一个 新承诺，通过 successCallback、errorCallback(除非该值是一个承诺，在这种情况下，它会使用在该承诺中使用 promise 链).

Also avoid using Promise(resolve,reject to create new promises. Instead use the promise returned by the .then method. It returns a new promise which is resolved or rejected via the return value of the successCallback, errorCallback (unless that value is a promise, in which case it is resolved with the value which is resolved in that promise using promise chaining).

有关更多信息，请参阅您错过了承诺.

For more information, see You're Missing the Point of Promises.

这篇关于来自 ES6 承诺的数据在我点击它之前不会呈现在页面上?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！