Develop Reference

I want to redirect to another page using angular JS

I want to redirect to another page of the application. In the similar manner as we do in MVC application or asp.net application. I have defined the Route.js file which is below.
route.js defined in the following manner
var MainApp=angular.module('RoutingApp', ['ngRoute'])
.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider
.when('/BusinessAgent', {
templateUrl: 'Views/BusinessAgent/BusinessAgent.html',
controller: 'BusinessAgentController'
})
.when('/Admin', {
templateUrl: 'Views/Admin/Admin.html'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
}]);
HTML page
<section id="banner">
<ul class="actions">
<li>
Business Agent
</li>
</ul>
</section>
On click of href it should redirect.But it is not getting redirected.

I think you are missing ng-view . add ng-view for routing. It works as placeholder
<div ng-view></div>

Try putting the url of controller instead of view there.
Instead of
$routeProvider
.when('/BusinessAgent', {
templateUrl: 'Views/BusinessAgent/BusinessAgent.html',
controller: 'BusinessAgentController'
})
Try using this.
$routeProvider
.when('/BusinessAgent', {
templateUrl: 'ControllerName/Actionname',
controller: 'BusinessAgentController'
})
If you are trying to get different view, then use partial view for the respective action of controller.

for me I like to use $urlRouterProvider rather than $routeProvider see the below example:
$urlRouterProvider.otherwise("/BusinessAgent");
$stateProvider
.state("BusinessAgent", {
url: "/BusinessAgent",
templateUrl: "Views/BusinessAgent/BusinessAgent.html",
controller: "BusinessAgentController"
});
that's mean you will call the state with sref rather than href like this:
<a sref="BusinessAgent" >BusinessAgent</a>

If you are using html5Mode enabled
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
Then replace '#' with '/' in href
Business Agent
if you disabled html5Mode then use
Business Agent

I saw that you used Angular UI-Router.
This is what I used in a recent application.Use the ui-sref tag instead of the href one.
<a ui-sref="/">Back to home</a>
<a ui-sref="cafe">Back to Cafe State</a>
I've used state provider instead of route provider.My states are
Root State
$stateProvider.state('/',{
url:"/",
templateUrl:'js/apps/choiceScreen/choice.html',
controller:'choiceCtrl'
})
Cafe State
.state('cafe',{
templateUrl:'js/apps/cafe/cafeScreen.html',
controller:'cafeCtrl'
});

you can use
$window.location.href = '/index.html';
for redurect to another page

Angular ui-router loads neither template nor controller?

I use ui-router for moving between pages, without reloading.
Here is one of my states:
$locationProvider.html5Mode({enabled: true, requireBase: false});
$stateProvider
.state('aboutBook', {
url: '/book/about/:bookId',
templateUrl: '/views/books/about-book.tpl.html',
controller: 'AboutBookCtrl'
})
Here I have ui-view div in my index.php file.
<div ui-view></div>
When I go to the /book/about/9874365942 page, I have both controller and template accessible, but ui-router doesn't load neither template nor controller.
What can cause such behavior? How can I fix it?
Note: ng-include, loads template just file
<div ng-include="'/views/books/about-book.tpl.html'"></div>
Update: $stateChangeStart and $stateChangeSuccess events aren't triggered as well.

How to do load page in Angular JS?

How to load content on page by clicking on menu links?
For example, there is menu:
Personal
Contacts
Question is in how change template HTML in page for each link?

Basically what you are trying to achieve will be accomplish by creating SPA. For that you need to use ngRoute module in your application(by adding angular-route.js)
For setting up angular router you need to register routes with there template & controller, etc. inside app.config.$routeProvider would take a URL by .when method.
Code
var app= angular.module('app', ['ngRoute']);
app.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/tab/:id', {
templateUrl: 'template.html',
controller: 'templateController'
}).
otherwise({
redirectTo: '/tab/1'
});
}]);
& then there would be one section on UI which is nothing but ng-view directive that watches of $routeProvider configuration with url in browser bar
<ng-view></ng-view>
For more details look at this answer
Working Example Plunkr

Additional to #pankaj, You have to use $location services in your controller. So that you can change view accordingly from controller.
ex. You have link
<a ng-click="saveData">Save</a>
Now in controller:
$scope.saveData = function(){
$location.href('viewName');
}
ref : https://docs.angularjs.org/api/ng/service/$location

Angular linking from View 2 to View 1 without page refresh

I have my angular app working with routing and two views.
When on the second view I am simply trying to add a link back to view 1 i.e "Back to home"
I tried the following and it works ofcourse, but it's acting like a normal href and refreshing the page
Back to Search
How do I add a link without the full page refresh but just change the views ?
EDIT ADDED Routing Config
app.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider){
$routeProvider
.when('/',{
templateUrl: '/views/main.html',
controller : 'SearchCtrl'
})
.when('/result',{
templateUrl: '/views/result.html',
controller : 'resultCtrl'
})
.otherwise({
redirectTo : '/'
});
}]);

I'm not sure if you are using HTML5 mode or not. But first you need to set up your homepage to "/".
$routeProvider
.when('/', {
templateUrl : 'pages/home.html',
etc....
})
After this you can link to your homepage using
<a href="#">

Angular UI Router - nested routes does not work on templates with nested state

Here is my code:
.state('profile',{
url : '/profile',
templateUrl: 'views/user.html',
controller: 'UserCtrl'
})
.state('profile.forgot',{
url : '/delivers',
templateUrl: 'views/user_forgot.html', <- this template not appear, when state is active
controller: 'forgotCtrl'
})
<a ui-sref="profile.forgot">Forgot your pasword?</a>
<div class="panel" ui-view=""></div>
When i click on link, in ui-view appeared template and controller of parent state.
AngularJS version is 1.2.0-rc.2

A nested state will render within the ui-view element of its parent template (which, if parentless, renders within the root ui-view). Make sure you read the 'Nested States & Views' section of the docs.

Please Pay attention to parent-child naming convention!
.state('profile.forgot',{
url : '/forgot',
templateUrl: 'views/profile.forgot.html',
controller: 'forgotCtrl'
})