Question

我正在尝试适应Angular的组件（来自Angular Fullstack Generator生成的代码）。我试图配置路由来解决＆＃34;查询＆＃34;如下所示：

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

    });

我收到一条错误消息 - 未知的查询提供程序。但是，如果我从构造函数中删除查询，则错误消息为＆＃34;查询未定义＆＃34;。你能不能看看我哪里出错了，是否应该注入＆＃34;查询＆＃34;变量进入控制器？我是Angular 1的新手，更不用说Angular 2了。

更新：我也试过这样的事情，但没有工作：

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

您不应在控制器query上注入constructor。如果您已指定MyController作为状态控制器，则可以这样做。

query解析已在组件bindings中传递。您可以直接在query

中获取this.query resolve的值

角度组件/控制器解析$ stateprovider

1 个答案: