Angular是一个单页应用程序(SPA),这很好,但如果我需要一些与index.html无关的其他页面,该怎么办?如何通过UI-Router状态和不同的ui-views实现?
例如,我有index.html:
例如,我有index.html:
<!DOCTYPE html>
<html data-ng-app="npAdmin">
<head>
...
</head>
<body>
<header>
<data-user-profile class="user-profile"></data-user-profile>
</header>
<section class="content-wrapper">
<aside data-main-menu></aside>
<div class="main-content" data-ui-view></div>
</section>
<footer class="row"></footer>
...
</body>
</html>
app.js:
var app = angular.module('npAdmin', ['ui.router']);
app.config(['$httpProvider', '$stateProvider', '$urlRouterProvider', function($httpProvider, $stateProvider, $urlRouterProvider) {
$stateProvider
.state('dashboard', {
url: '/dashboard',
templateUrl: '/app/dashboard/dashboard.html',
controller: 'DashboardCtrl'
})
.state('crm', {
url: '/crm',
templateUrl: '/app/crm/crm.html',
controller: 'CrmCtrl'
})
...
现在我需要 login.html 页面,它与 index.html 完全不同(不需要 index 的页头、页脚和侧边栏),但是 config stateProvider 只会查找 index.html 中的 ui-view 并通过状态将其更改为相应的内容。如何将 login.html 合并?
看起来并不难,但我还是不懂。
ui-router
真的非常强大和好用... 好好享受它吧 ;) - Radim Köhler