angular ui-router 官方教程

---

1.hello World
2.hello solar system
3.hello galaxy

UI-Router for angularJS(1.x)- Hello World

---

现在我们 要开始要用ui-router 写一个hello world 应用程序，她有两个页面（ hello 和 about），每一个页面都有自己的URL，我们能通过点击链接在两个页面之间切换，处于激活状态的那个链接将会高亮。

---

Full Source Code(源代码)

---

index.html

  
    
    
    

    
  

  
    Hello
    About

    
  

helloworld.js

var myApp = angular.module('helloworld', ['ui.router']);

myApp.config(function($stateProvider) {
  var helloState = {
    name: 'hello',
    url: '/hello',
    template: '
hello world!
'
  }

  var aboutState = {
    name: 'about',
    url: '/about',
    template: '
Its the UI-Router hello world app!
'
  }

  $stateProvider.state(helloState);
  $stateProvider.state(aboutState);
});

建立一个Hello World 应用程序

按照以下步骤

• 安装ui-router

使用npm: npm install --save angular-ui-router@next
使用bower: bower install [email protected]
直接从npmcdn下载

• 添加script 标签
  注意：在引入angular.js后面再引入angular-ui-router.js，再创建一个helloworld.js