[英]AngularJS moving ui-view breaks rendering
我正在使用jhipster框架開發angularJS網站。 該框架提供了AngularJS + Bootstrap + Spring Boot組合。 我一直在嘗試用棱角分明的材料替換引導程序,但是這樣做很麻煩。
原始index.html設置:
<div ui-view="navbar" ng-cloak=""></div>
<div class="container">
<div class="well" ui-view="content"></div>
</div>
導航欄和內容ui視圖都映射到視圖:
$urlRouterProvider.otherwise('/');
$stateProvider.state('site', {
'abstract': true,
views: {
'navbar@': {
templateUrl: 'scripts/components/navbar/navbar.html',
controller: 'NavbarController'
}
},
resolve: {
authorize: ['Auth',
function (Auth) {
return Auth.authorize();
}
],
translatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
$translatePartialLoader.addPart('global');
}]
}
});
$stateProvider
.state('home', {
parent: 'site',
url: '/',
data: {
authorities: []
},
views: {
'content@': {
templateUrl: 'scripts/app/main/main.html',
controller: 'MainController'
}
},
resolve: {
mainTranslatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate,$translatePartialLoader) {
$translatePartialLoader.addPart('main');
return $translate.refresh();
}]
}
});
我想在導航欄視圖中呈現我的內容,因為這是角形材質側面導航組件的工作方式: http : //codepen.io/marcysutton/pen/OPbpKm ,這是我的麻煩所在。
如果我將內容ui-view移至導航欄的正確部分,則渲染器將無法渲染
新的navbar.html:
...
</md-sidenav>
<div layout="column" flex id="content">
<md-content layout="column" flex class="md-padding">
<div class="well" ui-view="content"></div>
</md-content>
</div>
...
我是否需要更改角度代碼中的某些內容以支持此行為? 提前致謝! 注意:原始index.html可以工作,移動后將失敗。
我通過執行以下操作修復了該問題:
views: {
'content@site': {
...
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.