用ui-router
<!doctype html> <html ng-app="myApp"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <link rel="stylesheet" type="text/css" href="bootstrap.css" media="all"> <script src="angular.min.js"></script> <script src="angular-ui-router.min.js"></script> </head> <body> <div class='container'> <a ui-sref="state1">State 1</a> <a ui-sref="state2">State 2</a> <div class="row"> <div class="span12"> <div class="well" ui-view></div> </div> </div> </div> <script type="text/javascript"> var myApp = angular.module('myApp', ['ui.router']); myApp.config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise("/state1"); $stateProvider .state('state1', { url: "/state1", templateUrl: "partials/state1.html" }) .state('state1.list', { url: "/list", templateUrl: "partials/state1.list.html", controller: function($scope) { $scope.items = ["one","two"]; } }) .state('state2', { url: "/state2", templateUrl: "partials/state2.html" }) .state('state2.list', { url: "/list", templateUrl: "partials/state2.list.html", controller: function($scope) { $scope.things = ["three",'four']; } }); }); </script> </body> </html>
因为这里templateurl相当于发起了一个异步请求,可能是因为这个,可以尝试先将需要加载的template缓存,推荐使用ui-router
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
暂无简介
文章 0 评论 0
接受
发布评论
评论(2)
用ui-router
因为这里templateurl相当于发起了一个异步请求,可能是因为这个,可以尝试先将需要加载的template缓存,推荐使用ui-router