javascript - 用户界面路由器 : Best way to initialize variables when state is accesed

Question

我定义了 2 个状态，其中一个“门票”匹配/tickets ...

$stateProvider // define los estados de mi aplicacion
  .state("tickets", { // le asocio propiedades a cada state
      url: "/tickets", // ruta
      templateUrl: "modules/tickets/views/ticketsTemplate.html", // template a usar
      controller: "TicketsController", // controller a usar
      controllerAs : "tickets" // alias para el controller, para utilizar el this
  });

另一个“tickets.buscar”匹配/tickets/:id ，它使用与父级相同的 Controller (“TicketsController”)...

.state("tickets.buscar",{
      url: "/:id",
      templateUrl: "modules/tickets/views/ticketsResult.html"
      }
  ) // heredo el controller del padre

在 Controller 中，我有一个 init() 函数来初始化所需的变量。

this.init = function(){
  this.title = "Tickets";
  this.id = $state.params.id;

  if(this.id){
    this.getTicket(this.id);
  };
};

this.init();

根据我在 UI Router 文档上读到的内容，有 3 种方法可以访问状态:

• 通过 URL(或通过外部链接)
• 使用 $state.go()
• 在 html 中使用 ui-sref

我正在寻找一种方法来触发 Controller 重新加载，以便无论如何访问状态，init都会被执行。

我知道 $state.go() 中的 { reload : true } 选项，但这只能解决其中一种访问方法，并且还检查了 this other question但该解决方案不起作用，并且 UI Router 的文档中没有记录 $state 参数。

Answer 1

一个好的方法可能是在创建状态时使用 resolve 对象，以便可以自动为您设置票证。我还没有测试过这个，但这应该有效。

.state("tickets.buscar", {
    url: "/:id",
    templateUrl: "modules/tickets/views/ticketsResult.html",
    resolve: {
        ticket: function($state) {
            // return the output of `getTicket`
            // you would need to move the whole method here
        }
    }
}

然后，在您的 Controller 中，将 ticket 与 $scope 等一起注入(inject)。

angular.module('someModule')
.controller('TicketsController', ['$scope', 'ticket', function($scope, ticket) {
    console.log(ticket);
]);