如何在ui-router resolve属性中使用ocLazyLoad解析文件

时间:2017-12-17 11:30:21

标签: angularjs angular-ui-router oclazyload

我想通过使用ui-router resolve属性来查看api调用,但我的解析属性依赖于ocLazyLoad已解析文件。所以,我收到此错误Error: [$injector:unpr] Unknown provider: SavedFactoryProvider <- SavedFactory

这是我的代码

$stateProvider.state('app.saved', {
    url: '/saved',
    templateUrl: 'app/modules/saved/views/saved.html',
    controller: 'SavedSearchCtrl',
    resolve: {
      loadFiles: ['$ocLazyLoad', function($ocLazyLoad) {
        return $ocLazyLoad.load([{
          name: 'app.saved',
          files: [
            'app/modules/saved/controller.js',
            'app/modules/saved/factory.js',
          ],
          cache: false
        }]);
      }],
      searches: ['loadFiles', 'SavedFactory', function(loadFiles, SavedFactory) {
        return SavedFactory.getSavedSearches();
      }]
    }
});

谢谢!

1 个答案:

答案 0 :(得分:2)

路线解析器与$q.all并行解析。由于$ocLazyLoad.load(...)是异步的,因此在调用searches时肯定无法完成。

$ocLazyLoad.load(...)返回一个可以链接的承诺,以避免竞争条件,例如:

  searches: function($ocLazyLoad, $injector) {
    return $ocLazyLoad.load([
      {
        name: 'app.saved',
        files: [
          'app/modules/saved/controller.js',
          'app/modules/saved/factory.js',
        ],
        cache: false
      }
    ])
    .then(function () {
      var SavedFactory = $injector.get('SavedFactory');
      return SavedFactory.getSavedSearches();
    });
  }

与ngRoute相反,UI路由器支持解析器层次结构;依赖关系图正在建立在状态变化上。它们的解析顺序可以通过它们的依赖性来确定。因此searches应列出loadFiles作为其依赖项:

  searches: function(loadFiles, $injector) {
    var SavedFactory = $injector.get('SavedFactory');
    return SavedFactory.getSavedSearches();
  }
由于UI路由器如何在内部调用解析器函数,显然需要

$injector.get