AngularJS——ui-router的简单使用

AngularJS——ui-router使用

1、导入js文件

需要注意的是:必须导入angular.min.js这个文件,且angular.min.js必须导入在angular-ui-router.min.js前面。

<script type="text/javascript" src="JS/angular.min.js"></script>
<script type="text/javascript" src="JS/angular-ui-router.min.js"></script>
2、注入angular模块
var app = angular.module('myApp', ['ui.router']);

注入的名字“ui.router”

3、在页面书写连接(导航)
<a ui-sref="index">login</a>
4、定义视图

ui-view替代的是ngroute路由的ng-view。

<div ui-view></div>
5、配置路由状态
app.config(function ($stateProvider,$urlRouterProvider){
    $urlRouterProvider.otherwise('/');//设置默认的访问路径
    $stateProvider     
    .state("index", { //导航用的名字,如<a ui-sref="index">login</a>里的login
        url: '/',    //访问路径 
        template:'<div>模板内容......</div>'
    })      

 });
阅读更多 登录后自动展开
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页