私はAngular Appでルーティングするためにui-routerを使用しています。マイページは、ヘッダーで何かのこの単一のui-viewを置き換える方法複数のui-viewを単一のhtmlに持つ場合
<html>
<div ui-view="header"></div>
<div ui-view="content"></div>
<div ui-view="footer"></div>
</html>
クリック時のような単一のHTMLで3 UI-のビューを持って、私は=「content2」第二のUIビューへのルートUIビュー=「コンテンツ」を持っています。しかし、ヘッダー&フッターは残ります。これを達成する方法は？
これは入れ子状態で解決できます。
$stateProvider
.state('parent', {
abstract: true,
views: {
header: {
templateUrl: 'header.html'
},
footer: {
templateUrl: 'footer.html'
},
content: {
template: '<div ui-view></div>'
}
}
})
.state('parent.child1', {
url: '/child1',
templateUrl: 'child1.html'
})
.state('parent.child2', {
url: '/child2',
templateUrl: 'child2.html'
});
このようなことも試すことができます。それは私のために働いた。
.state('app', {
abstract: true,
url: "/",
templateUrl: 'partials/app.html',
controller: 'MainCtrl'
})
.state('app.content1', {
url: "",
views: {
'header': {
templateUrl: "partials/header.html",
},
'footer': {
templateUrl: 'partials/footer.html',
},
'content': {
templateUrl: "partials/content1.html",
controller: 'FirstContentCtrl',
}
}
})
.state('app.content2', {
url: "",
views: {
'header': {
templateUrl: "partials/header.html",
},
'footer': {
templateUrl: 'partials/footer.html',
},
'content': {
templateUrl: "partials/content2.html",
controller: 'SecondContentCtrl',
}
}
})
Urの回答がうまく機能します。しかし、問題は、私は複数のコンテンツビューを持っている –