这篇文章主要介绍了AngularJS中ui-view传参的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
Angular路由传参
首页
<!DOCTYPE html> <html ng-app="app"> <head> <title>路由传参</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.min.css" rel="external nofollow" type="text/css"></link> </head> <body> <div class="container"> <nav class="navbar navbar-default" role="navigation"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="#" rel="external nofollow" >柳絮飞祭奠</a> </div> </div> </nav> </div> <div ng-click="go()" ng-controller="state_go_controller"> $state.go传参数</div> <a ui-sref="param({index:'123'})">传参数</a> <div ui-view></div> </body> <script type="text/javascript" src="../../plugins/angular/angular.min-1.4.6.js"></script> <script type="text/javascript" src="../../plugins/angular/angular-ui-router-0.2.10.js"></script> <script type="text/javascript"> var app=angular.module("app",['ui.router']); app.config(['$stateProvider','$urlRouterProvider',function($stateProvider,$urlRouterProvider){ $stateProvider.state('index1', { url : '/index1', templateUrl : '/Angular/uiview/param/index1.html' }).state('param',{ url:'/param/:index', templateUrl: '/Angular/uiview/param/param.html' }); $urlRouterProvider.otherwise('/index1'); }]).config(function($sceProvider){ $sceProvider.enabled(false); }); app.controller("state_go_controller", function($state, $scope) { $scope.go = function() { $state.go('param', { index : 42 }); }; }); app.controller("view1_controller",function($stateParams){ //接收参数 alert($stateParams.index); }); </script> </html>
跳转页
<div ng-controller="view1_controller"></div> 接收参数 </body>
运行
点击跳转就可以看到alert的参数。
感谢你能够认真阅读完这篇文章,希望小编分享的“AngularJS中ui-view传参的示例分析”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。