Question

我正在使用angular-ui-router，这通常很棒，但我定义stateProvider的代码变得非常重复，例如。

.state('home', {
  url: "/home",
  templateUrl: "home.html"
})
.state('products', {
  url: "/products",
  templateUrl: "products.html"
})
.state('suppliers', {
  url: "/suppliers",
  templateUrl: "suppliers.html"
})

有没有办法告诉它每个州都有一个与州名相匹配的网址和模板？

Answer 1

写一个函数。

var myState = function($stateProvider, name) {
    $stateProvider.state(name, {
        url: '/' + name,
        templateUrl: name + '.html'
    })
}

然后你可以像这样使用它：

myState($stateProvider, 'home');
myState($stateProvider, 'products');
myState($stateProvider, 'suppliers');

如果您愿意，还可以扩展$stateProvider对象：

$stateProvider.myState = function(name) {
    return this.state(name, {
        url: '/' + name,
        templateUrl: name + '.html'
    })
}

像这样使用：

$stateProvider
    .myState('home')
    .myState('products')
    .myState('suppliers');

我可以使我的angular-ui-router stateProvider定义更短吗？

1 个答案: