资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划，从策略到执行的一站式服务

网站建设 >

查看其它板块

angular.js中怎么实现页面传参

本篇文章给大家分享的是有关angular.js中怎么实现页面传参，小编觉得挺实用的，因此分享给大家学习，希望大家阅读完这篇文章后可以有所收获，话不多说，跟着小编一起来看看吧。

黄南州网站制作公司哪家好，找创新互联！从网页设计、网站建设、微信开发、APP开发、响应式网站设计等网站项目制作，到程序开发，运营维护。创新互联从2013年创立到现在10年的时间，我们拥有了丰富的建站经验和运维经验，来保证我们的工作的顺利进行。专注于网站建设就选创新互联。

（1）自带路由ngRoute

 
   
     
    AngularJS 路由实例 
   
   
    
AngularJS 路由应用
 
       名: 
 
    
     
      
  • 首页1
    •  
      
  • second
    •  
      
  • 打印机
    •  
      
  • 其他
    •  
    
 
    
                                       

(2)ui-router

 
   
     
    AngularJS 路由实例  
       
 
      
   
   
   
   
    
     
      
  • 首页1
    •  
      
  • second
    •  
      
  • third
    •  
    
 
    href传参数 
    ui-sref传参数 
    state.go传参数 
     location传参数 
     
        
                          /* var app = angular.module('routerApp', ['ui.router']); */     var app=angular.module('routerApp',['ui.router']);     app.controller('MainCtrl', function($scope, $state,$location) {       $scope.ngclick_go = function() {         $state.go('sixth',{name: 42}); // 跳转后的URL： #/camnpr/appManager        };        $scope.ngclick_location = function() {          $location.path('/sixth/detail/42'); // 功能也是跳转的        };                          });      app.config(function($stateProvider, $urlRouterProvider) {        $urlRouterProvider.otherwise('/second');  //与原生的$routerProvider写法不一样的就是$urlRouterProvider先写默认路径        $stateProvider   //再用$stateProvider.state('',{}).state('',{})...代替$routerProvider.when()方法          .state('second', {            url: '/second',             views: {'second0': {                templateUrl: 'second0.html' ,  //看到templateUrl:后面包含了很多的模板                controller: 'MainCtrl'               },              'second1': {                templateUrl: 'second1.html',                controller: 'MainCtrl'                              },              'second2': {                templateUrl: 'second2.html',                controller: 'MainCtrl'              }            }           })          .state('third', {            url: '/third',            templateUrl: 'third.html' ,   //看到templateUrl:后面包含了很多的模板            controller: 'MainCtrl'           })                     .state('fourth', {            url: '/fourth/:name',            templateUrl: 'forth.html' ,    //看到templateUrl:后面包含了很多的模板            controller: function ($stateParams,$scope) {              $scope.name=$stateParams.name;              alert(=$stateParams.name)            }            })           .state('fifth', {            url: '/fifth/:name/:id',            templateUrl: 'fifth.html' ,    //看到templateUrl:后面包含了很多的模板            controller: function ($stateParams,$scope) {              alert($stateParams.name+"  "+$stateParams.id)            }            })          .state('sixth', {            url: '/sixth/detail/:name',            templateUrl: 'sixth.html' ,    //看到templateUrl:后面包含了很多的模板            controller: function ($stateParams,$scope) {              alert($stateParams.name)            }            })          /* .state('fourth', {            url: '/fourth/:name',            templateUrl: 'third1.html' ,    //看到templateUrl:后面包含了很多的模板            controller: function ($stateParams,$scope) {              $scope.name=$stateParams.name;            }            }) */                });                  

以上就是angular.js中怎么实现页面传参，小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注创新互联行业资讯频道。


当前题目：angular.js中怎么实现页面传参
地址分享：http://cdkjz.cn/article/jiiejd.html
返回首页 了解更多建站资讯

相关资讯

多年建站经验

多一份参考，总有益处

联系快上网，免费获得专属《策划方案》及报价

咨询相关问题或预约面谈，可以通过以下方式与我们联系

大客户专线   成都：13518219792   座机：028-86922220

在线咨询 提交需求
友情链接 交换友情链接
温江网站设计广汉锦华橡塑全网营销成都婚庆策划圣月阀门成都橡塑保温管创新互联重庆大吉雪茄西部信息机房遂宁海缘科技

成都网站建设公司地址：成都市青羊区太升南路288号锦天国际A座10层 建设咨询028-86922220

成都快上网科技有限公司-四川网站建设设计公司 | 蜀ICP备19037934号 Copyright 2020,ALL Rights Reserved cdkjz.cn | 成都网站建设 | © Copyright 2020版权所有.

专家团队为您提供成都网站建设,成都网站设计,成都品牌网站设计,成都营销型网站制作等服务,成都建网站就找快上网！ | 成都网站建设哪家好？ | 网站建设地图