Angular UI路由器无法解析注入的参数

一尘不染

Angular UI路由器无法解析注入的参数

angularjs

因此，请考虑我的angularUI路由设置中的以下片段。我导航到路线/ category / manage / 4 /
details（例如）。我希望可以在相关的控制器加载之前解决“类别”问题，实际上是可以在我可以从类别服务返回类别的resolve函数中放置一个断点，并查看类别是否已返回的事实。现在在控制器本身内部放置另一个断点，我可以看到“类别”始终是未定义的。它不是由UI路由器注入的。

谁能看到这个问题？它可能不在我提供的代码中，但在运行代码时没有错误，因此无法确定问题的根源在哪里。典型的js静默失败！

        .state('category.manage', {
            url: '/manage',
            templateUrl: '/main/category/tree',
            controller: 'CategoryCtrl'
        })
        .state('category.manage.view', {
            abstract: true,
            url: '/{categoryId:[0-9]*}',
            resolve: {
                category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) {
                    return CategoryService.getCategory($stateParams.categoryId).then(returnData); //this line runs before the controller is instantiated
                }]
            },
            views: {
                'category-content': {
                    templateUrl: '/main/category/ribbon',
                    controller: ['$scope', 'category', function ($scope, category) {
                        $scope.category = category; //category is always undefined, i.e., UI router is not injecting it
                    }]
                }
            },
        })
            .state('category.manage.view.details', {
                url: '/details',
                data: { mode: 'view' },
                templateUrl: '/main/category/details',
                controller: 'CategoryDetailsCtrl as details'
            })

阅读 239

2020-07-04

共1个答案

一尘不染

这个概念正在奏效。我在这里创建了工作的plunker。更改在这里

代替这个

resolve: {
    category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) {
        //this line runs before the controller is instantiated
        return CategoryService.getCategory($stateParams.categoryId).then(returnData); 
    }]
},

我刚刚返回了getCategory的结果…

resolve: {
    category: ['CategoryService', '$stateParams', function (CategoryService, $stateParams) {
      return CategoryService.getCategory($stateParams.categoryId); // not then
    }]
},

使用朴素的服务实现：

.factory('CategoryService', function() {return {
  getCategory : function(id){
    return { category : 'SuperClass', categoryId: id };
  }
}});

即使那是一个承诺…解决将一直等到它被处理…

.factory('CategoryService', function($timeout) {return {
  getCategory : function(id){
    return $timeout(function() {
        return { category : 'SuperClass', categoryId: id };
    }, 500);
  }
}});

2020-07-04