Skip to content

Commit 0c080ce

Browse files
.
0 parents  commit 0c080ce

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

79 files changed

+18954
-0
lines changed

CHANGELOG.md

Lines changed: 405 additions & 0 deletions
Large diffs are not rendered by default.

CONTRIBUTING.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
2+
# Report an Issue
3+
4+
Help us make UI-Router better! If you think you might have found a bug, or some other weirdness, start by making sure
5+
it hasn't already been reported. You can [search through existing issues](https://github.com/angular-ui/ui-router/search?q=wat%3F&type=Issues)
6+
to see if someone's reported one similar to yours.
7+
8+
If not, then [create a plunkr](http://bit.ly/UIR-Plunk) that demonstrates the problem (try to use as little code
9+
as possible: the more minimalist, the faster we can debug it).
10+
11+
Next, [create a new issue](https://github.com/angular-ui/ui-router/issues/new) that briefly explains the problem,
12+
and provides a bit of background as to the circumstances that triggered it. Don't forget to include the link to
13+
that plunkr you created!
14+
15+
**Note**: If you're unsure how a feature is used, or are encountering some unexpected behavior that you aren't sure
16+
is a bug, it's best to talk it out on
17+
[StackOverflow](http://stackoverflow.com/questions/ask?tags=angularjs,angular-ui-router) before reporting it. This
18+
keeps development streamlined, and helps us focus on building great software.
19+
20+
21+
Issues only! |
22+
-------------|
23+
Please keep in mind that the issue tracker is for *issues*. Please do *not* post an issue if you need help or support. Instead, see one of the above-mentioned forums or [IRC](irc://irc.freenode.net/#angularjs). |
24+
25+
####Purple Labels
26+
A purple label means that **you** need to take some further action.
27+
- ![Not Actionable - Need Info](ngdoc_assets/incomplete.png): Your issue is not specific enough, or there is no clear action that we can take. Please clarify and refine your issue.
28+
- ![Plunkr Please](ngdoc_assets/example.png): Please [create a plunkr](http://bit.ly/UIR-Plunk)
29+
- ![StackOverflow](ngdoc_assets/so.png): We suspect your issue is really a help request, or could be answered by the community. Please ask your question on [StackOverflow](http://stackoverflow.com/questions/ask?tags=angularjs,angular-ui-router). If you determine that is an actual issue, please explain why.
30+
31+
If your issue gets labeled with purple label, no further action will be taken until you respond to the label appropriately.
32+
33+
# Contribute
34+
35+
**(1)** See the **[Developing](#developing)** section below, to get the development version of UI-Router up and running on your local machine.
36+
37+
**(2)** Check out the [roadmap](https://github.com/angular-ui/ui-router/milestones) to see where the project is headed, and if your feature idea fits with where we're headed.
38+
39+
**(3)** If you're not sure, [open an RFC](https://github.com/angular-ui/ui-router/issues/new?title=RFC:%20My%20idea) to get some feedback on your idea.
40+
41+
**(4)** Finally, commit some code and open a pull request. Code & commits should abide by the following rules:
42+
43+
- *Always* have test coverage for new features (or regression tests for bug fixes), and *never* break existing tests
44+
- Commits should represent one logical change each; if a feature goes through multiple iterations, squash your commits down to one
45+
- Make sure to follow the [Angular commit message format](https://github.com/angular/angular.js/blob/master/CONTRIBUTING.md#commit-message-format) so your change will appear in the changelog of the next release.
46+
- Changes should always respect the coding style of the project
47+
48+
49+
50+
# Developing
51+
52+
UI-Router uses <code>grunt >= 0.4.x</code>. Make sure to upgrade your environment and read the
53+
[Migration Guide](http://gruntjs.com/upgrading-from-0.3-to-0.4).
54+
55+
Dependencies for building from source and running tests:
56+
57+
* [grunt-cli](https://github.com/gruntjs/grunt-cli) - run: `$ npm install -g grunt-cli`
58+
* Then, install the development dependencies by running `$ npm install` from the project directory
59+
60+
There are a number of targets in the gruntfile that are used to generating different builds:
61+
62+
* `grunt`: Perform a normal build, runs jshint and karma tests
63+
* `grunt build`: Perform a normal build
64+
* `grunt dist`: Perform a clean build and generate documentation
65+
* `grunt dev`: Run dev server (sample app) and watch for changes, builds and runs karma tests on changes.

LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License
2+
3+
Copyright (c) 2013-2015 The AngularUI Team, Karsten Sperling
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

README.md

Lines changed: 248 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,248 @@
1+
# AngularUI Router &nbsp;[![Build Status](https://travis-ci.org/angular-ui/ui-router.svg?branch=master)](https://travis-ci.org/angular-ui/ui-router)
2+
3+
**Note: this is the Angular 1.x source for UI-Router version 1.0 alpha. If you are looking for the source for UI-Router
4+
version 0.2.x, it can be found [here](https://github.com/angular-ui/ui-router/tree/legacy)**
5+
6+
---
7+
8+
9+
#### The de-facto solution to flexible routing in angular
10+
---
11+
**[Download stable](http://angular-ui.github.io/ui-router/release/angular-ui-router.js)** (or **[Minified](http://angular-ui.github.io/ui-router/release/angular-ui-router.min.js)**) **|**
12+
**[Guide](https://github.com/angular-ui/ui-router/wiki) |**
13+
**[API](http://angular-ui.github.io/ui-router/site) |**
14+
**[Sample](http://ui-router.github.io/sample-app/#/mymessages) ([Src](https://github.com/ui-router/sample-app)) |**
15+
**[FAQ](https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions) |**
16+
**[Resources](#resources) |**
17+
**[Report an Issue](https://github.com/angular-ui/ui-router/blob/master/CONTRIBUTING.md#report-an-issue) |**
18+
**[Contribute](https://github.com/angular-ui/ui-router/blob/master/CONTRIBUTING.md#contribute) |**
19+
**[Help!](http://stackoverflow.com/questions/ask?tags=angularjs,angular-ui-router) |**
20+
21+
22+
---
23+
24+
Angular UI-Router is a client-side [Single Page Application](https://en.wikipedia.org/wiki/Single-page_application)
25+
routing framework for [AngularJS](http://angularjs.org).
26+
27+
Routing frameworks for SPAs update the browser's URL as the user nagivates through the app. Conversely, this allows
28+
changes to the browser's URL to drive navigation through the app, thus allowing the user to create a bookmark to a
29+
___location deep within the SPA.
30+
31+
UI-Router applications are modeled as a hierarchical tree of states. UI-Router provides a
32+
[*state machine*](https://en.wikipedia.org/wiki/Finite-state_machine) to manage the transitions between those
33+
application states in a transaction-like manner.
34+
35+
## Get Started
36+
37+
**(1)** Get UI-Router in one of the following ways:
38+
- clone & [build](CONTRIBUTING.md#developing) this repository
39+
- [download the release](http://angular-ui.github.io/ui-router/release/angular-ui-router.js) (or [minified](http://angular-ui.github.io/ui-router/release/angular-ui-router.min.js))
40+
- [link to cdn](http://cdnjs.com/libraries/angular-ui-router)
41+
- via **[jspm](http://jspm.io/)**: by running `$ jspm install angular-ui-router` from your console
42+
- or via **[npm](https://www.npmjs.org/)**: by running `$ npm install angular-ui-router` from your console
43+
- or via **[Bower](http://bower.io/)**: by running `$ bower install angular-ui-router` from your console
44+
- or via **[Component](https://github.com/component/component)**: by running `$ component install angular-ui/ui-router` from your console
45+
46+
**(2)** Include `angular-ui-router.js` (or `angular-ui-router.min.js`) in your `index.html`, after including Angular itself (For Component users: ignore this step)
47+
48+
**(3)** Add `'ui.router'` to your main module's list of dependencies (For Component users: replace `'ui.router'` with `require('angular-ui-router')`)
49+
50+
When you're done, your setup should look similar to the following:
51+
52+
>
53+
```html
54+
<!doctype html>
55+
<html ng-app="myApp">
56+
<head>
57+
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
58+
<script src="js/angular-ui-router.min.js"></script>
59+
<script>
60+
var myApp = angular.module('myApp', ['ui.router']);
61+
// For Component users, it should look like this:
62+
// var myApp = angular.module('myApp', [require('angular-ui-router')]);
63+
</script>
64+
...
65+
</head>
66+
<body>
67+
...
68+
</body>
69+
</html>
70+
```
71+
72+
### [Nested States & Views](http://plnkr.co/edit/u18KQc?p=preview)
73+
74+
The majority of UI-Router's power is in its ability to nest states & views.
75+
76+
**(1)** First, follow the [setup](#get-started) instructions detailed above.
77+
78+
**(2)** Then, add a [`ui-view` directive](https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-view) to the `<body />` of your app.
79+
80+
>
81+
```html
82+
<!-- index.html -->
83+
<body>
84+
<div ui-view></div>
85+
<!-- We'll also add some navigation: -->
86+
<a ui-sref="state1">State 1</a>
87+
<a ui-sref="state2">State 2</a>
88+
</body>
89+
```
90+
91+
**(3)** You'll notice we also added some links with [`ui-sref` directives](https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref). In addition to managing state transitions, this directive auto-generates the `href` attribute of the `<a />` element it's attached to, if the corresponding state has a URL. Next we'll add some templates. These will plug into the `ui-view` within `index.html`. Notice that they have their own `ui-view` as well! That is the key to nesting states and views.
92+
93+
>
94+
```html
95+
<!-- partials/state1.html -->
96+
<h1>State 1</h1>
97+
<hr/>
98+
<a ui-sref="state1.list">Show List</a>
99+
<div ui-view></div>
100+
```
101+
```html
102+
<!-- partials/state2.html -->
103+
<h1>State 2</h1>
104+
<hr/>
105+
<a ui-sref="state2.list">Show List</a>
106+
<div ui-view></div>
107+
```
108+
109+
**(4)** Next, we'll add some child templates. *These* will get plugged into the `ui-view` of their parent state templates.
110+
111+
>
112+
```html
113+
<!-- partials/state1.list.html -->
114+
<h3>List of State 1 Items</h3>
115+
<ul>
116+
<li ng-repeat="item in items">{{ item }}</li>
117+
</ul>
118+
```
119+
120+
>
121+
```html
122+
<!-- partials/state2.list.html -->
123+
<h3>List of State 2 Things</h3>
124+
<ul>
125+
<li ng-repeat="thing in things">{{ thing }}</li>
126+
</ul>
127+
```
128+
129+
**(5)** Finally, we'll wire it all up with `$stateProvider`. Set up your states in the module config, as in the following:
130+
131+
132+
>
133+
```javascript
134+
myApp.config(function($stateProvider, $urlRouterProvider) {
135+
//
136+
// For any unmatched url, redirect to /state1
137+
$urlRouterProvider.otherwise("/state1");
138+
//
139+
// Now set up the states
140+
$stateProvider
141+
.state('state1', {
142+
url: "/state1",
143+
templateUrl: "partials/state1.html"
144+
})
145+
.state('state1.list', {
146+
url: "/list",
147+
templateUrl: "partials/state1.list.html",
148+
controller: function($scope) {
149+
$scope.items = ["A", "List", "Of", "Items"];
150+
}
151+
})
152+
.state('state2', {
153+
url: "/state2",
154+
templateUrl: "partials/state2.html"
155+
})
156+
.state('state2.list', {
157+
url: "/list",
158+
templateUrl: "partials/state2.list.html",
159+
controller: function($scope) {
160+
$scope.things = ["A", "Set", "Of", "Things"];
161+
}
162+
});
163+
});
164+
```
165+
166+
**(6)** See this quick start example in action.
167+
>**[Go to Quick Start Plunker for Nested States & Views](http://plnkr.co/edit/u18KQc?p=preview)**
168+
169+
**(7)** This only scratches the surface
170+
>**[Dive Deeper!](https://github.com/angular-ui/ui-router/wiki)**
171+
172+
173+
### [Multiple & Named Views](http://plnkr.co/edit/SDOcGS?p=preview)
174+
175+
Another great feature is the ability to have multiple `ui-view`s view per template.
176+
177+
**Pro Tip:** *While multiple parallel views are a powerful feature, you'll often be able to manage your
178+
interfaces more effectively by nesting your views, and pairing those views with nested states.*
179+
180+
**(1)** Follow the [setup](#get-started) instructions detailed above.
181+
182+
**(2)** Add one or more `ui-view` to your app, give them names.
183+
>
184+
```html
185+
<!-- index.html -->
186+
<body>
187+
<div ui-view="viewA"></div>
188+
<div ui-view="viewB"></div>
189+
<!-- Also a way to navigate -->
190+
<a ui-sref="route1">Route 1</a>
191+
<a ui-sref="route2">Route 2</a>
192+
</body>
193+
```
194+
195+
**(3)** Set up your states in the module config:
196+
>
197+
```javascript
198+
myApp.config(function($stateProvider) {
199+
$stateProvider
200+
.state('index', {
201+
url: "",
202+
views: {
203+
"viewA": { template: "index.viewA" },
204+
"viewB": { template: "index.viewB" }
205+
}
206+
})
207+
.state('route1', {
208+
url: "/route1",
209+
views: {
210+
"viewA": { template: "route1.viewA" },
211+
"viewB": { template: "route1.viewB" }
212+
}
213+
})
214+
.state('route2', {
215+
url: "/route2",
216+
views: {
217+
"viewA": { template: "route2.viewA" },
218+
"viewB": { template: "route2.viewB" }
219+
}
220+
})
221+
});
222+
```
223+
224+
**(4)** See this quick start example in action.
225+
>**[Go to Quick Start Plunker for Multiple & Named Views](http://plnkr.co/edit/SDOcGS?p=preview)**
226+
227+
228+
## Resources
229+
230+
* [In-Depth Guide](https://github.com/angular-ui/ui-router/wiki)
231+
* [API Reference](http://angular-ui.github.io/ui-router/site)
232+
* [Sample App](http://angular-ui.github.com/ui-router/sample/) ([Source](https://github.com/angular-ui/ui-router/tree/gh-pages/sample))
233+
* [FAQ](https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions)
234+
* [Slides comparing ngRoute to ui-router](http://slid.es/timkindberg/ui-router#/)
235+
* [UI-Router Extras / Addons](http://christopherthielen.github.io/ui-router-extras/#/home) (@christopherthielen)
236+
237+
### Videos
238+
239+
* [Introduction Video](https://egghead.io/lessons/angularjs-introduction-ui-router) (egghead.io)
240+
* [Tim Kindberg on Angular UI-Router](https://www.youtube.com/watch?v=lBqiZSemrqg)
241+
* [Activating States](https://egghead.io/lessons/angularjs-ui-router-activating-states) (egghead.io)
242+
* [Learn Angular.js using UI-Router](http://youtu.be/QETUuZ27N0w) (LearnCode.academy)
243+
244+
245+
246+
## Reporting issues and Contributing
247+
248+
Please read our [Contributor guidelines](CONTRIBUTING.md) before reporting an issue or creating a pull request.

bower.json

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "angular-ui-router",
3+
"description": "State-based routing for AngularJS",
4+
"license": "MIT",
5+
"main": "./release/angular-ui-router.js",
6+
"dependencies": {
7+
"angular": ">= 1.2.0"
8+
},
9+
"ignore": [
10+
"**/.*",
11+
"**/tsconfig.json",
12+
"**/webpack.config.js",
13+
"**/node_modules",
14+
"**/ng2*",
15+
"**/typings",
16+
"commonjs",
17+
"bower_components",
18+
"component.json",
19+
"package.json",
20+
"lib",
21+
"config",
22+
"sample",
23+
"test",
24+
"tests",
25+
"ngdoc_assets",
26+
"Gruntfile.js",
27+
"files.js"
28+
],
29+
"version": "1.0.0-alpha.3",
30+
"homepage": "http://angular-ui.github.com/ui-router"
31+
}

0 commit comments

Comments
 (0)