Question

我对angularjs很新，想问几个问题。我正在开发一个项目，我需要从服务器获取一个表单对象。表单是一个复杂的树对象，有很多层，我创建了4个不同的组件/选项卡来绑定到相应的对象。我创建了一个服务来获取数据。

angular.module('myService', ['restangular'])
        .factory('FormService', ['Restangular', '$q', function(Restangular, $q) { 

    function FormService() {
        var self = this;
        self.form = null;

        self.getForm = function getForm(id)
        {
            var deferred = $q.defer();
            if (self.form !== null)
            {
                deferred.resolve(self.form);
                console.log("Cache!");
            }
            else {
                Restangular.one('form', id).get()
                  .then(function successCallback(response)
                  {
                    self.form = response;
                    deferred.resolve(response);
                    console.log("from server!");

                  }, function errorCallback(response) {
                    deferred.reject(response);
                    console.log("error, cannot resolve object");
                  });
            }
            return deferred.promise;
        }

      return new FormService();
  }])
});

然后我的组件都在下面有类似的配置：

angular.module('page1Summary', ['formService']).component('page1Summary', {
  templateUrl: 'page1-summary/page1-summary.template.html',
  controller: ['FormService', function Page1SummaryController(FormService) {
    var ctrl = this;

    // ******* Init Params Start *********** //
    this.$onInit = function() {
      // init value when object ready
      FormService.getForm()
        .then(
          /* on success */
          function successCallback(data) {
            console.log("page1-summary init");
            ctrl.form = data;
            console.log("page1-summary got the data");
        },
          /* on error */
          function errorCallback(data)
          {
              console.log("failed to get form");
          }
      );
    }

    /* other stuff here */
 }

我正在打印“缓存！”或getForm服务上的“from server”。这样我就可以弄清楚我是从服务器还是内存中提取数据。但是，每次刷新时，结果都不同。有时，数据保存在服务中的本地变量中，并得到“缓存”，但有时，我的一些页面将从“服务器”获取数据。

我想知道出了什么问题？我认为只有服务第一次从服务器获得，但似乎并非如此。

有人可以帮助我，并指出我做错了什么？

提前致谢！

Answer 1

您正在将结果缓存到self.form。 self.form又是变量FormSerivce工厂成员。它将缓存结果，直到您不刷新页面。刷新页面后，self.form中的值将像应用程序中的所有其他变量一样重置。

您想要的不是在self.form中缓存结果，而是将其缓存在localstorage中。因此，即使在页面刷新后，您也可以获得结果。

Angularjs 1.5.x与组件

1 个答案: