Ui-Router上有解析的错误时序或功能顺序 [英] Bad timing or order of functions with resolves on Ui-Router

问题描述

我有一个应用程序，其中我的主要状态进行解析以进行http调用并获取数组。

I have an app where my main state makes a resolve makes an http call and fetches an array.

然后，子数组应该显示一个对象这个数组，但是似乎控制器的变量定义得太早了，不能正确地更新，所以孩子出来的是空的。

Then, the child array is supposed to display one object from this array, but it seems that the variables from the controller are defined too early and don't get updated properly, so the child comes out empty.

我试过了它不需要http调用（ var array = [array] ），并且可以正常工作，但不能使用http调用。

I've tried it without http call (var array = [array]), and it works fine, but not with the http call.

有关如何解决此问题的任何提示？

Any tips on how to fix this?

以下是控制器：

.controller('appCtrl',['$scope', 'SearchService','fair', function($scope, SearchService, fair){

  $scope.data = SearchService;
  $scope.datafairs = $scope.data.flatexhibitors;
  console.log($scope.datafairs);
}])

.controller('ChildController',['$scope', 'exhibitor', '$filter', function($scope, exhibitor, $filter){

  $scope.$watch(function() { return $scope.fair; }, function(newVal) { 
    $scope.fairs = newVal;
    console.log($scope.fairs);
    $scope.chosenexhibitor = $filter("filter")($scope.fairs, {'slug':exhibitor}, true);
  }, true);


}])

服务：

.factory("SearchService", function($http) {  

  var service = {
    flatexhibitors : [],
    datafairs : [],
    getAllExhibitors : function (wop) {
      var searchindex = wop;
        console.log(searchindex);
        var url = '../register/backend/databaseconnect/getexhibitors.php';
        var config = {
            params: {
                search: searchindex
            },
            cache:true
        };
        $http.get(url, config).then(function (data) {
          service.datafairs = data.data.rows;
          for (var i in service.datafairs) {
            service.flatexhibitors.push(service.datafairs[i].doc);
          };
          return service.flatexhibitors;
        });
    }   
  }
  return service;

})

和st可以：

.config(function($stateProvider) {


  $stateProvider.state('berliner', {
    url: '/berlinerliste',
    params : {search: 'Berliner 2017'},
    resolve: {
      fair: function(SearchService, $stateParams) {
        return SearchService.getAllExhibitors($stateParams.search);
      }
    },
    views: {
      'header': {   
        templateUrl: 'header.htm'   
      },
      'main':{    
        templateUrl: 'bl2017.htm',
        controller: 'appCtrl'
      }    
    }
  })

  .state('berliner.exhibitor', {
    url: '/{id}', 
    resolve: {
      exhibitor: function($stateParams) {
        var slug = $stateParams.id;
        return slug;
      }
    },
    views: {
      'header': {   
        templateUrl: 'header.htm'   
      },
      'wop':{    
        templateUrl: 'exhibitor.htm',
        controller: 'ChildController'
      }    
    }
  })

})

我设法在 Plunkr 。

推荐答案

更改 getAllExhibit ors 返回如下的承诺：

getAllExhibitors : function (wop) {
  var searchindex = wop;
    console.log(searchindex);
    var url = '../register/backend/databaseconnect/getexhibitors.php';
    var config = {
        params: {
            search: searchindex
        },
        cache:true
    };
    return $http.get(url, config).then(function (data) {
      service.datafairs = data.data.rows;
      for (var i in service.datafairs) {
        service.flatexhibitors.push(service.datafairs[i].doc);
      };
      return service.flatexhibitors;
    });
}

这篇关于Ui-Router上有解析的错误时序或功能顺序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！