时间戳

首页 > 解决方案 > 如何等待来自流星呼叫的数据？

angularjs - 如何等待来自流星呼叫的数据？

问题描述

我是 angular1.5 的初学者，我的问题是返回的数据Meteor.call()不显示在 HTML

这是我的代码：

集线器.js

class HubsController {
  data = [];

  constructor($scope, $uibModal) {
    $scope.viewModel(this);

    this.$scope = $scope;
    this.$uibModal = $uibModal;

    this.initViews();

    this.subscribe('admin.verifiedBusinesses');
    this.subscribe('admin.verifiedStars');
    this.getData();
    console.log('data', this.data);
  }

  ...

  getData() {
    Meteor.call('warehouse.getAll', (err, data) => {
      if (err) {
        console.log(err);
      }
      // Initialize active routes.
      this.data = data;
      console.log(this.data); // data works fine
      return data;
    });
  }
}

angular
  .module('material-lite')
  .controller('hubsDataController', ['$scope', '$uibModal', HubsController]);

数据在这里不起作用：

集线器.html

<div class="table-responsive" style="overflow-x: hidden" ng-controller="hubsDataController">
  ...
            <tr ng-repeat="hubsData in data" class="table_row">
              <td>{{ hubsData.name }}</td>
              <td>

HubsController我希望 html 中的输出与从getData函数返回的类中的输出相同

标签： angularjsmeteorangular-meteor

解决方案

一种方法是从基于回调的 API 创建一个 AngularJS 承诺：

getData() {
    const deferred = this.$q.defer();
    Meteor.call('warehouse.getAll', (err, data) => {
      if (err) {
        console.log(err);
        deferred.reject(err);
        return;
      }
      // Initialize active routes.
      this.data = data;
      console.log(this.data); // data works fine
      deferred.resolve(data);        
    });
    return deferred.promise;
}

当 AngularJS 承诺解决时，AngularJS 框架会自动调用$apply. 这会将数据带入 AngularJS 执行上下文。只有在 AngularJS 执行上下文中应用的操作才能受益于 AngularJS 数据绑定、异常处理、属性监视等。

推荐阅读