一:跑通ui-router.跑通后的样子:这个不解释了,都是很基本的东西.二:切换视图:跑起来后的后果:三:如何通过链接切换视图. 1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> ...
一:跑通ui-router.
跑通后的样子:
这个不解释了,都是很基本的东西.
二:切换视图:
跑起来后的后果:
三:如何通过链接切换视图.
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body ng-app="app" ng-controller="ctrl"> 8 <a href="" ui-sref="main">main</a> 9 <a href="#/main2">main2</a>10 <a href="" ng-click="gomain3()">main3</a>11 <div ui-view>12 <p>ui-view没有被替换掉,你就能看到我了</p>13 </div>14 </body>15 <script type="text/javascript" src='/images/loading.gif' data-original="../js/angular1.4.3.js"></script>16 <script type="text/javascript" src='/images/loading.gif' data-original="../js/angular-ui-router.min.js"></script>17 <script>18 angular.module('app',['ui.router'])19 .config(['$stateProvider','$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {20 $urlRouterProvider.otherwise("/main");21 $stateProvider.state('main',{22 url:"/main",23 template:'<div>main1:{{title}}</div>',24 controller:['$scope', function ($scope) {25 $scope.title='hello angular';26 }]27 }).state({28 name:"main2",29 url:"/main2",30 template:'<div>main2:{{title}}</div>',31 controller: function ($scope) {32 $scope.title="hello angulr main2";33 }34 }).state("main3",{35 url:"/main3",36 template:"<div>main3:{{name}}</div>",37 controller: function ($scope) {38 $scope.name="hello 张三"39 }40 });41 }]).controller('ctrl', function ($scope,$state) {42 $scope.gomain3= function () {43 $state.go("main3");44 }45 })46 47 </script>48 </html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:angularJs的ui
关键词:JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。