javascript - 根据 $stateProvider 中的解析渲染模板

Question

考虑这段代码:

bank.config(function($stateProvider) {
  $stateProvider
    .state('main.bank', {
      url: '/',
      controller: 'BankCtrl',
      resolve: {
        money: function(bankResource) {
          return bankResource.getMoney();
      },
      templateUrl: 'bank/bank.html'
    });
});

上面，一旦解析完成执行，我就会渲染 bank.html 模板。

我想根据我的 money 函数返回的内容来渲染特定模板。

示例:

如果money返回一个包含元素的对象，则渲染bank.html

如果money返回一个空对象，则返回empty-bank.html

如何在我的 $stateProvider 中实现此目的？或者将其放在指令中会更有意义吗？

Answer 1

将您的 resolve 代码移至父 Controller ，为 bank.html 和 empty-bank.html 各创建两个子路由，并基于解析结果的路由，类似这样 -

.state('main', {
  url: '/',
  controller: 'MainCtrl',
  resolve: {
    money: function(bankResource) {
      return bankResource.getMoney();
  }
})
.state('main.bank', {
  url: '/blank',
  controller: 'BankCtrl',
  templateUrl: 'bank/bank.html'
})
.state('main.emptybank', {
  url: '/emptyblank',
  controller: 'EmptyBankCtrl',
  templateUrl: 'bank/empty-bank.html'
});

将解析结果注入(inject) Controller 并根据输出更改状态。