Angular ui-router将值解析为字符串

all*_*kim 12 javascript angularjs angularjs-routing angularjs-controller angular-ui-router

使用ui-router,我在状态函数中添加所有解析逻辑,如下所示;

    //my-ctrl.js
    var MyCtrl = function($scope, customers) {
      $scope.customers = customers;
    }

    //routing.js
    $stateProvider.state('customers.show', {
      url: '/customers/:id',
      template: template,
      controller: 'MyCtrl',
      resolve: {   // <-- I feel this must define as like controller
        customers: function(Customer, $stateParams) {
          return Customer.get($stateParams.id);
        }
      }
    });
Run Code Online (Sandbox Code Playgroud)

但IMO,resolve对象必须属于控制器,如果在控制器文件中定义它,则易于读取和维护.

    //my-ctrl.js
    var MyCtrl = function($scope, customers) {
      $scope.customers = customers;
    }
    MyCtrl.resolve = {
      customers: function(Customer, $stateParams) {
        return Customer.get($stateParams.id);
      };
    };

    //routing.js
    $stateProvider.state('customers.show', {
      url: '/customers/:id',
      template: template,
      controller: 'MyCtrl',
      resolve: 'MyCtrl.resolve'   //<--- Error: 'invocables' must be an object.
    });
Run Code Online (Sandbox Code Playgroud)

但是,当我将其定义为MyCtrl.resolve,因为IIFE,我得到以下错误.

Failed to instantiate module due to: ReferenceError: MyCtrl is not defined
Run Code Online (Sandbox Code Playgroud)

当我将那个定义为字符串时'MyCtrl.resolve',我得到了这个

Error: 'invocables' must be an object.
Run Code Online (Sandbox Code Playgroud)

我看到控制器被定义为字符串,所以我认为也可以通过使用装饰器或其他东西将值提供为字符串.

有人做过这种方法吗?这样我就可以保持我的routings.js干净并提供相关信息.在相关文件中?

Jef*_*ley 8

这听起来像是建立决心的一种巧妙方式,但我认为你不能做到这一点.

除了"解决"需要一个对象这一事实之外,它是在一个阶段定义的,其中所有可用的都是提供者.此时,控制器甚至还不存在.

更糟糕的是,"解决"意味着定义控制器本身的输入.要在控制器中定义解析,然后期望创建控制器之前对其进行求值是循环依赖关系.

在过去,我已经定义了$stateProvider定义之外的解析函数,至少允许它们被重用.我从来没有尝试过任何比这更好的人.

var customerResolve = ['Customer', '$stateParams',
    function(Customer, $stateParams) {
        return Customer.get($stateParams.id);
    }
];

// ....

$stateProvider.state('customers.show', {
  url: '/customers/:id',
  template: template,
  controller: 'MyCtrl',
  resolve: {
    customers: customerResolve
  }
});
Run Code Online (Sandbox Code Playgroud)

  • 这是真的,但在运行时,为了让Angular评估解析,它需要创建控制器.在评估完决心之前,它无法创建控制器. (2认同)