AngularJS的ngroute 路由传参

来源:互联网 发布:ty66 永久域名 编辑:程序博客网 时间:2024/05/19 08:01

转自:出处

<html><head>    <meta name="viewport" content="width=device-width" />    <title></title>    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>        <script src="http://cdn.bootcss.com/angular.js/1.2.9/angular-route.min.js"></script></head><body>    <div ng-app="myApp">        <div class="header">            <a href="#div1">第一个div</a>            <a href="#div2">第二个div</a>            <a href="#div3">第三个div</a>            <a href="#content/13">点击去内容</a>        </div>    <div ng-view></div>    </div></body></html>

var app = angular.module("myApp", ['ngRoute']);    app.config(['$routeProvider', function ($routeProvider) {        $routeProvider            .when('/div1', {                template: '<p>这是div1{{text}}</p>',                controller: 'div1Controller'            })            .when('/div2', {                template: '<p>这是div2{{text}}</p>',                    controller: 'div2Controller'            })             .when('/div3', {                 template: '<p>这是div3{{text}}</p>',                 controller: 'div3Controller'             })          .when('/content/:id', {              template: '<p>这是content{{id}}</p>',              controller: 'div4Controller'          })            .otherwise({                redirectTo: '/div1'            });    }]);    app.controller('div1Controller', function ($scope) {        $scope.text = 'phonegap中文网div1Controller';    })    app.controller('div2Controller', function ($scope) {        $scope.text = 'phonegap中文网div2Controller';    })        app.controller('div3Controller', function ($scope) {        $scope.text = 'phonegap中文网div3Controller';    })    app.controller('div4Controller', function ($scope, $routeParams, $location) {                if ($routeParams.id==0) {            $location.path('/div1');//进行页面跳转        }        console.log($routeParams);        $scope.id = $routeParams.id;        $scope.text = 'phonegap中文网div3Controller';    })


原创粉丝点击