ngRoute module provides routing for angular apps.We can download angular-route.js from the below location
e.g.
//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.js where x.y.z indicates the version on angular-route.js like 1.3.5
Example :
5.html:
<!DOCTYPE html>
<html lang="en">
<head>
<title>ngRoute</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="angular-route.js"></script>
<script src="5controller.js"></script>
</head>
<body ng-app="myapp">
<div ng-view></div>
</body>
</html>
5controller.js :
var app=angular.module('myapp',['ngRoute']);
app.config(function($routeProvider){
$routeProvider
.when('/',{
templateUrl:'5a.html',
//template:'Loaded from /'
})
.when('/fiveb',{
templateUrl:'5b.html'
})
.when('/fivec',{
templateUrl:'5c.html'
})
.otherwise({
redirectTo:'/'
});
});
5a.html:
I am in 5a<a href="#/fiveb">Open fiveb</a>
5b.html:
I am in 5b
5c.html:
<a href="#/fiveb">Open fiveb</a>I am in 5c
No comments:
Post a Comment