Маршрут к компоненту с разрешением маршрута | AngularJS

После прочтения статьи https://ui-router.github.io/guide/ng1/route-to-component, мы пытались использовать разрешение в AngularJS. Но, к сожалению, мы получили ошибку как:

Неизвестный провайдер: testProvider ‹- test ‹- 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);

});

person ColleenF123456    schedule 10.12.2019    source источник


Ответы (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);
    });    
});

Для получения дополнительной информации см.

person georgeawg    schedule 10.12.2019