angularJs 路由

设置好请求路径所展示的网页
根据用户的请求路径,跳转到不同的页面

要先安装 angular-route

命令请看官网

demo

//使用ng官方提供的路由
//1.引包  把angular 和 angular-route 引进去
//2.创建模块同时添加依赖项ng-Route
//3.调用模块的config 方法,注入一个$routeProvider对象
//4.使用$routeProvider配置路由表
//5.以HTTP协议测试访问
angular.modular('DemoApp',['ng-Route']).config(['$routeProvider',function($routeProvider){
$routeprovider
  .when('/',{ 
      // 我们利用templateUrl 来写更多的标签
      //templateUrl:""
      template:'

{{name}}

', //页面不可能只有一个标签,所以我们添加一个控制器来管理 controller:'IndexController' }) .when('/login',{ template:'

{{name}}

', controller:'loginController' }) .when('/register',{ template:'

{{name}}

', controller:'registerController' }) }]) angular.moudle('DemoApp') .controller('IndexController',['$scope',function($scope]){ $scope.name='index' }]) .controller('loginController',['$scope',function($scope]){ $scope.name='login' }]) .controller('registerController',['$scope',function($scope]){ $scope.name='register' }])

关于测试

单页应用的url 是指#后面的路径

你可能感兴趣的:(angularJs 路由)