/Downloads/54361bf500012f7400000000/AngularJS/app/UIRoute3.html#/index/usermng/addusertype
<div class="row"> <div class="col-md-3"> <div class="row"> <div class="col-md-12"> <div class="list-group"> <a ui-sref="#" class="list-group-item active">用户分类</a> <a ui-sref="index.usermng.highendusers" class="list-group-item">高端用户</a> <a ui-sref="index.usermng.normalusers" class="list-group-item">中端用户</a> <a ui-sref="index.usermng.lowusers" class="list-group-item">低端用户</a> <a ui-sref="#" class="list-group-item">黑名单</a> </div> </div> </div> <div class="row"> <div class="col-md-12"> <button class="btn btn-primary" ng-click="addUserType()">新增用户</button> </div> </div> </div> <div class="col-md-9"> <div ui-view></div> </div> </div>
<div class="row"> <div class="col-md-12"> <h3>高端用户列表</h3> </div> </div> <div class="row"> <div class="col-md-12"> <table class="table table-bordered table-hover table-condensed"> <thead> <tr> <th>序号</th> <th>姓名</th> <th>年龄</th> <th>作品</th> </tr> </thead> <tbody> <tr> <td rowspan="2">1</td> <td>大漠穷秋</td> <td>29</td> <td>《用AngularJS开发下一代WEB应用》</td> </tr> <tr> <td>大漠穷秋</td> <td>29</td> <td>《用AngularJS开发下一代WEB应用》</td> </tr> <tr> <td>2</td> <td>大漠穷秋</td> <td>29</td> <td>《Ext江湖》</td> </tr> <tr> <td>3</td> <td colspan="2">大漠穷秋</td> <td>《ActionScript游戏设计基础(第二版)》</td> </tr> </tbody> </table> </div> </div>
var routerApp = angular.module('routerApp', ['ui.router']); routerApp.config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/index'); $stateProvider .state('index', { url: '/index', views: { '': { templateUrl: 'tpls3/index.html' }, 'topbar@index': { templateUrl: 'tpls3/topbar.html' }, 'main@index': { templateUrl: 'tpls3/home.html' } } }) .state('index.usermng', { url: '/usermng', views: { 'main@index': { templateUrl: 'tpls3/usermng.html', controller: function($scope, $state) { $scope.addUserType = function() { $state.go("index.usermng.addusertype"); } } } } }) .state('index.usermng.highendusers', { url: '/highendusers', templateUrl: 'tpls3/highendusers.html' }) .state('index.usermng.normalusers', { url: '/normalusers', templateUrl: 'tpls3/normalusers.html' }) .state('index.usermng.lowusers', { url: '/lowusers', templateUrl: 'tpls3/lowusers.html' }) .state('index.usermng.addusertype', { url: '/addusertype', templateUrl: 'tpls3/addusertypeform.html', controller: function($scope, $state) { $scope.backToPrevious = function() { window.history.back(); } } }) .state('index.permission', { url: '/permission', views: { 'main@index': { template: '这里是权限管理' } } }) .state('index.report', { url: '/report', views: { 'main@index': { template: '这里是报表管理' } } }) .state('index.settings', { url: '/settings', views: { 'main@index': { template: '这里是系统设置' } } }) });