Get started with angular-ui-router CDN
MIT licensed
AngularUI Router: Declarative routing, view navigation for AngularJS apps.
Tags:- angular
- ui
- angular-ui
- ui-router
- router
- state-machine
- state-tree
Stable version
Copied!
How to start using angular-ui-router CDN
<!DOCTYPE html>
<html>
<head>
<title>Get started with angular-ui-router CDN - cdnhub.io</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
<script src="https://cdn.cdnhub.io/angular-ui-router/1.1.0/angular-ui-router.min.js"></script>
<script src="app.js"></script>
<style>
.ng-hide.ng-scope { display: none !important; }
</style>
</head>
<body ng-app="myApp">
<nav ng-controller="NavController">
<a href="#/home">Home</a> |
<a href="#/about">About</a>
</nav>
<div ng-view></div>
<script>
angular.module('myApp', ['ui.router'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('/', {
url: '/',
template: '<h1>Welcome to the Home Page</h1>'
})
.state('/about', {
url: '/about',
template: '<h1>About Us</h1>'
});
$urlRouterProvider.otherwise('/');
})
.controller('NavController', function($state) {
this.goHome = function() {
$state.go('/');
};
this.goAbout = function() {
$state.go('/about');
};
});
</script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
All versions
0.0.1
0.2.0
0.2.10
0.2.11
0.2.13
0.2.14
0.2.15
0.2.16
0.2.17
0.2.18
0.2.7
0.2.8
0.3.0
0.3.1
0.3.2
0.4.0
0.4.1
0.4.2
0.4.3
1.0.0
1.0.0-alpha.1
1.0.0-alpha.2
1.0.0-alpha.3
1.0.0-alpha.4
1.0.0-alpha.5
1.0.0-alpha0
1.0.0-beta.1
1.0.0-beta.2
1.0.0-beta.3
1.0.0-rc.1
1.0.1
1.0.10
1.0.11
1.0.12
1.0.13
1.0.14
1.0.15
1.0.16
1.0.17
1.0.18
1.0.19
1.0.20
1.0.21
1.0.22
1.0.23
1.0.24
1.0.25
1.0.26
1.0.27
1.0.28
1.0.29
1.0.3
1.0.30
1.0.4
1.0.5
1.0.6
1.0.7
1.0.8
1.0.9
1.1.0
*** 1.1.1