我有一个包含多个命名嵌套 View 的模板:
模板1:
<body>
<div ui-view></div>
</body>
模板2:
<header></header>
<div ui-view="left"></div>
<div ui-view="canvas"></div>
<div ui-view="right"></div>
我有以下配置设置:
.state("metricDashboard", {
url: "/metric-dashboard",
css: { href: "core/metric-dashboard/style.css" },
views: {
"": {
templateUrl: "core/metric-dashboard/view.html",
controller: 'MetricDashboard',
},
"left@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/left.html",
controller: "MetricDashboardLeft",
},
"canvas@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/canvas.html",
controller: "MetricDashboardCanvas"
},
"right@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/right.html",
controller: "MetricDashboardRight"
}
}
})
我该如何更改个别路线？例如，如果我想更改“left@metricDashboard”，但保留“canvas”和“right”路线。如果不创建新状态并再次显式声明所有路由，我似乎无法找到语法。
最佳答案
好吧，我猜您想创建另一个状态，该状态只会更改其中一个 View ，而不是全部 View 。
我们将其命名为 left 并使其成为 metricsDashboard 的子级
.state("metricDashboard", {
url: "/metric-dashboard",
css: { href: "core/metric-dashboard/style.css" },
views: {
"": {
templateUrl: "core/metric-dashboard/view.html",
controller: 'MetricDashboard',
},
"left@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/left.html",
controller: "MetricDashboardLeft",
},
"canvas@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/canvas.html",
controller: "MetricDashboardCanvas"
},
"right@metricDashboard": {
templateUrl: "core/metric-dashboard/partials/right.html",
controller: "MetricDashboardRight"
}
}
})
.state("metricDashboard.left", {
url: "left",
views: {
"left@metricDashboard" : {
templateUrl: "some.html",
controller: "AwesomeCtl",
controllerAs: "awe"
}
}
})
现在，当您进入该状态时，只有左侧 View 会更改，其他 View 将保持父状态 metricDashboard 中的定义。
关于javascript - 仅更改多个命名嵌套路由之一，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35159544/