javascript - 在等待 $onInit 回调完成时，我应该为 Angular 绑定(bind)属性返回什么

Question

我有一个像这样的 Angular 服务:

appModule.factory('dataService', DataService);

DataService.$inject = ['dataContext'];

function DataService(dataContext) {
    var service = Object.create(DataService.prototype);
    service._dataContext = dataContext;
    service._details = {};
    service.$onInit();

    return service;
}

DataService.prototype = {
    $onInit: function () {
        this._dataContext.combinedQuery(DataQuery)
            .then(function (data) {
                this._details = data[0];
            }.bind(this));
    },

    Details: function () {
        return this._details;
    }    
};

使用它的 Controller 如下:

DetailsController.$inject = ["dataService"];

function DetailsController(dataService) {
    this._dataService = dataService;
}

DetailsController.prototype = {
    $onInit: function () {
        this.details = this._dataService.Details;
    },

}

并且 View 正在绑定(bind){{$DetailsController.details}}。

运行DataService.$onInit时会返回，DataService.Details函数返回值会在之前绑定(bind)到DetailsController.details >this._details = data[0] 已被调用。

我应该从 DataService.Details 返回什么，以便一旦设置 this._details，数据就会显示在绑定(bind) View 上？

我认为应该像下面这样，但我不想再次调用 $onInit:

return this.$onInit()
        .then(function () {
            return this._details;
        }.bind(this));

Answer 1

我会尝试使用Promises

appModule.factory('dataService', DataService);

DataService.$inject = ['dataContext'];

function DataService(dataContext) {
    DataService.prototype().then( function (err, prototype){
      if(err){
       return err;
      }
       //Else
       var service = Object.create(prototype);
       service._dataContext = dataContext;
       service._details = {};
       service.$onInit();
       if(service){
         return service;
       }
    });
}

DataService.prototype = {
  return new Promise( function( resolve, reject){
    $onInit: function () {
        this._dataContext.combinedQuery(DataQuery)
            .then(function (data) {
                this._details = data[0];
            }.bind(this));
    }

    if( this.details ){
      Details: function () {
        return resolve( this._details );
      }   
    } else {
        return reject({err: 'Unable to set details'})
    }

  });  
};

我无法保证上面的代码是否 100% 有效，因为我没有构建 Plunker 或类似的代码，但是，它确实看起来是一个异步问题。如果这不起作用，您还应该将 $on.init() 包装到 Promise 中。

无论如何，我从来没有见过像你一样编写services/factories，所以我对此有点困惑。

希望对大家有一点帮助。