渲染基础上，决心$ stateProvider模板

考虑以下代码：

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内实现这一目标？或者它会更有意义的是它在一个指令？

来源

2015-04-02 stecd

移动你的resolve代码父控制器，创建两个子路由一个为每个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' 
});

注入决心的结果到您的控制器并根据输出更改状态。

来源

2015-04-02 19:43:05 Sam

如果我刷新页面，这种解决方案不再有效。在控制器中更改状态似乎不起作用，因为控制器只实例化一次。当我刷新页面时，控制器不会再被调用，因此不会调用“更改状态”逻辑，并且视图变为空白。 – stecd 2015-04-03 20:21:10

如果刷新页面，则始终首先调用父控制器，并重新执行解析代码。 – Sam 2015-04-04 10:45:33

在主状态的index.html中，根据货币变量切换视图。 EA：

.state('main', { 
    url: '/', 
    controller: 'MainCtrl' 
})

在你MainCtrl设置变量根据你的函数的输出：

$scope.money = "bank"

或

$scope.money = "emptybank"

在您的index.html通话

然后一个观点：

您的路由器：

.state('main.bank', { 
    url: '/bank', 
    views: { 
    bank: { 
    controller: 'BankCtrl', 
    templateUrl: 'bank/bank.html' 
    }, 
    emptybank: { 
    controller: 'EmptyBankCtrl', 
    templateUrl: 'bank/emptybank.html' 
    } 
    } 
})

对不起，任何语法错误。从头部输入我的手机。

但是这应该解决您的问题，并在进度使其更加“Angularesque” :-)

来源

2015-04-03 22:56:05 stevenvanc

渲染基础上，决心$ stateProvider模板

回答

相关问题