如何按顺序获取角度应用程序加载数据

Question

我对angular还是比较陌生，但是，我明白了...

使用一些ui-route状态，我可以使用用户选择的数据逐步构建URL（视图）。 它类似于向导界面。 步骤1 =>步骤2 =>步骤3 =>最终结果

从头到尾没有太大的问题，因为随着用户的点击，数据被保存在服务中。 当刷新页面或直接将其输入浏览器时（即有人给我发送了链接）/ step-1 / step-2，问题就会出现，就像用户选择了步骤1然后选择步骤2一样。

在这种情况下，我需要获取所有用户选择的数据。 获取步骤1的数据，在加载该数据时，获取步骤2的数据，然后获取步骤3的数据，依此类推。但是，我只需要获取尚未被检索到的数据。

为了实现这样的想法，我需要服务返回存储在其data属性中的数据，或者如果该数据为空，请获取它，将其保存到其属性中，然后返回它。

关于如何实现这一点的任何想法？

这是一些伪代码，用于说明我正在尝试在服务中执行的操作。 我不确定语法是否100％正确，但应该说明这一点。

    app.factory('dataService', ['$http', '$q', '$filter', 'ngAuthSettings', 'localStorageService', function ($http, $q, $filter, ngAuthSettings, localStorageService) {


    var ServiceFactory = {};
    var _getData = function () {

        var deferred = $q.defer();
        _Step1Data= localStorageService.get('Step1Data');

        if (_Step1Data) {
            $http.get('api/Step1Data').then(function (response) {
                _data = response.data.results;
                localStorageService.set('Step1Data', _Step1Data);
                deferred.resolve(response);
            });
        }
        else {
            deferred.resolve(_Step1Data);
        }
        return deferred.promise;
    };
    ServiceFactory.getStep1Data = _getStep1Data;
 return ServiceFactory;

}]);

假设获取第2步，第3步数据的过程与第1步相同，则加载数据的调用如下

dataService.getStep1Data ()
            .then(function (data) {
                vm.Step1Data = data;
                dataService.getStep2Data ()
                .then(function (data) {
                    vm.Step2Data = data;                    
                }, function (error) {
                    //some error stuff
                })
            }, function (error) {
                //some error stuff
            });

采用阶梯式方法的原因是，每个步骤都取决于先前步骤中选择的数据以获取当前步骤数据。

Answer 1

这是您要查找的resolve属性 。 您可以在实例化任何步骤控制器之前使用它来解析步骤数据。 然后可以将已解析的步骤数据注入到控制器中。

您可以将其与数据服务结合起来，如下所示：

step1.state({ 
  resolve: {
    step1Data: function(dataService) {
      return dataService.getStep1Data () 
    }
  }
  ....
}