Question

阅读了https://ui-router.github.io/guide/ng1/route-to-component一文之后，我们尝试在AngularJS中使用resolve。但不幸的是，我们收到以下错误消息：

未知提供者：testProvider <-测试<-SaleComponentController”

有人可以帮助我们在控制器“ SaleComponentController”中将“测试”显示为输出

angular.module('salesApp')
.config(['$stateProvider',function($stateProvider){

    $stateProvider.state('sales',{
        url: '/sales',
        data: {
            requiredAuth: true
        },
        component: 'sales',
        reloadOnSearch: false,
        views: {//default
            '@': {
                component: 'sales'
            },
            'delivery@sales': {
                component: 'delivery' 
            }
        },
        resolve: {
            test: function(){
                return "test";
            }
        }
    })
}])

.component('sales',{
    bindings: {
        items: '<',
        test: '@'  
    },
    templateUrl: 'sales/sales.html',
    controller: 'SaleComponentController'
})
.controller('SaleComponentController',
  function (SalesService, $q, $transitions,test){
    var $ctrl = this;
    console.log("test");
    console.log($ctrl.test);

});

Answer 1

使用单向（"<"）绑定声明解析器绑定：

.component('sales',{
    bindings: {
        items: '<',
        ̶t̶e̶s̶t̶:̶ ̶'̶@̶'̶
        test: '<'  
    },
    templateUrl: 'sales/sales.html',
    controller: 'SaleComponentController'
})

依赖于存在的绑定的初始化逻辑应放在控制器的$onInit()方法中：

.controller('SaleComponentController',
  ̶f̶u̶n̶c̶t̶i̶o̶n̶ ̶(̶S̶a̶l̶e̶s̶S̶e̶r̶v̶i̶c̶e̶,̶ ̶$̶q̶,̶ ̶$̶t̶r̶a̶n̶s̶i̶t̶i̶o̶n̶s̶,̶t̶e̶s̶t̶)̶{̶
  function (SalesService, $q, $transitions){
    var $ctrl = this;
    this.$onInit = () => {
        console.log("test");
        console.log($ctrl.test);
    });    
});

有关更多信息，请参见

When to use the AngularJS `$onInit` Life-Cycle Hook

使用路由解析路由到组件| AngularJS

1 个答案: