您好,登錄后才能下訂單哦!
這篇文章主要介紹了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進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。