Угловой компонент/контроллер разрешить $ stateprovider

Question

Я пытаюсь адаптироваться к компоненту Angular (из кода, созданного генератором угловых полных стеков). Я пытался настроить маршруты для решения «запрос» согласно ниже:

angular.module('paizaApp') 
    .config(function($stateProvider) { 
    $stateProvider 
    .state('main', { 
     url: '/', 
     template: '<main query="$resolve.query"></main>', 
     resolve:{ 
     query:function(){return null;} 
     }, 


.state('starred',{ 
    url:'/users/:userId/starred', 
    template: '<main query="$resolve.query"></main>', 
    resolve:{ 
     query:function($stateParams){ 
      return {stars:$stateParams.userId}; 
     } 
     } 
    }) 
    .state('users',{ 
    url:'/users/:userId', 
    template: '<main query="$resolve.query"></main>', 
    resolve:{ 
     query:function($stateParams){ 
     return {user:$stateParams.userId} 
     } 
    } 

Ниже приведены коды для контроллера/компонента.

class MainController { 

    constructor($http, $scope, socket, Auth, query) { 
     this.$http = $http; 
     this.socket = socket; 
     this.awesomeThings = []; 

     $scope.isLoggedIn = Auth.isLoggedIn; 
     $scope.getCurrentUser = Auth.getCurrentUser; 

    $onInit() { 
     this.$http.get('/api/things',{params:{query:query}}) 
     .then(response => { 
      this.awesomeThings = response.data; 
      this.socket.syncUpdates('thing', this.awesomeThings); 
     }); 
    }//////// 
////////////////////////////////////// etc.. 


    angular.module('paizaApp') 
    .component('main', { 
     templateUrl: 'app/main/main.html', 
     bindings:{query:'='}, 
     controller: MainController 

    }); 

У меня появляется сообщение об ошибке - неизвестный поставщик запросов. Однако, если я удаляю запрос из конструктора, тогда сообщение об ошибке «запрос не определен». Не могли бы вы увидеть, где я поступил не так, и должен ли я вводить переменную «запрос» в контроллер? Я новичок в угловые 1, не говоря уже о Угловом 2.

Update: Я тоже пытался что-то подобное, но не получился:

angular.module('paizaApp') 
    .config(function($stateProvider) { 
    $stateProvider 
    .state('main', { 
     url: '/', 
     template: '<main></main>', 
     resolve:{ 
     query:function(){return null;} 
     }, 
     controller:function($scope,query){ 
     $scope.query=query 
     } 

И:

angular.module('paizaApp') 
    .component('main', { 
     templateUrl: 'app/main/main.html', 

     controller: MainController, 
     scope:{query:'='} 

    }); 

Answer 1

вы не должны 't ввести query на контроллере constructor. Вы могли бы это сделать, если указали MyController в качестве контроллера для состояния.

query решение передано в компонент bindings. Вы можете напрямую получить значение query разрешить внутри this.query