gpt4 book ai didi

angularjs - 使用额外 View 扩展父状态

转载 作者:行者123 更新时间:2023-12-01 23:44:57 24 4
gpt4 key购买 nike

使用:AngularJS 和 UI-Router。

我正在尝试创建一个包含两个 View 的页面:menumain。一个用于菜单,另一个用于可能存在的任何内容。但是,我不想每次都在所有状态下定义这两个 View 。 menu View 不会经常更改。所以我创建了一个仅包含 menu View 的父“根”状态。然后其他状态从中派生并添加适当的 View 。

代码如下所示(在文件 app.js 中):

angular
.module('Admin', ["ui.router"])
.config(["$stateProvider", function($stateProvider) {
$stateProvider.state('root', {
abstract: true,
views: {
"menu": {
templateUrl: "../static/partials/menu.html",
controller: "MenuController"
}
}
}).state('root.main', {
url: "",
parent: 'root',
views: {
"main": {
templateUrl: "../static/partials/landing.html",
controller: "MainController"
}
}
}).state('root.login', {
url: "/login",
parent: 'root',
views: {
"main": {
templateUrl: "../static/partials/login.html",
controller: "LoginController"
}
}
})
;
}])
.controller('MainController', ["$scope", "$http", mainController])
.controller('MenuController', ["$scope", "$http", menuController])
.controller('LoginController', ["$scope", "$http", loginController])
;

结果是只显示menu View 。 main View 不会显示,除非我也将它添加到 root 状态。任何人都知道什么是错的?

编辑

包含 View 的 HTML:

<div ng-app="Admin">
<a ui-sref="root.main">Click me</a>
<div class="ui menu" ui-view="menu"></div>
<div class="ui segment">
<div ui-view="main"></div>
</div>
<br>
</div>

<script src="{{ url_for('static', filename='js/menu.js') }}"></script>
<script src="{{ url_for('static', filename='js/main_controllers.js') }}"></script>
<script src="{{ url_for('static', filename='js/app.js') }}"></script>

编辑 2

这里有一个类似的问题:UI-Router inheriting views ,但这对我不起作用...

编辑 3

我设法非常简单地在 plnkr 中重现了这个:http://plnkr.co/edit/uYlFgsvq8hQHON8EESEx?p=preview

最佳答案

刚遇到同样的问题,并使用您的 plnkr 找到了解决方案。您需要将“@”添加到 View 名称,如下所示。

.state('root.main', {
url: "",
parent: 'root',
views: {
"main@": {
templateUrl: "../static/partials/landing.html",
controller: "MainController"
}
}
})

关于angularjs - 使用额外 View 扩展父状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29828746/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com