Which module is used for routing in AngularJs

0 votes
I want to know how can we navigate between several pages i.e one one page in html to other using angularJs
Feb 4, 2020 in Angular by kartik
• 37,520 points
1,234 views

1 answer to this question.

0 votes

The ngRoute module helps your application to become a Single Page Application.

If you want to navigate to different pages in your application, but you also want the application to be a SPA (Single Page Application), with no page reloading, you can use the ngRoute module.

The ngRoute module routes your application to different pages without reloading the entire application.

Example:

Navigate to "red.htm", "green.htm", and "blue.htm":

<body ng-app="myApp">

<p><a href="#/!">Main</a></p>

<a href="#!red">Red</a>
<a href="#!green">Green</a>
<a href="#!blue">Blue</a>

<div ng-view></div>

<script>
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
  $routeProvider
  .when("/", {
    templateUrl : "main.htm"
  })
  .when("/red", {
    templateUrl : "red.htm"
  })
  .when("/green", {
    templateUrl : "green.htm"
  })
  .when("/blue", {
    templateUrl : "blue.htm"
  });
});
</script>
</body>
answered Feb 4, 2020 by Niroj
• 82,840 points

Related Questions In Angular

0 votes
1 answer

What is the service that is used to configure the UI-Router and ngRoute in AngularJs?

Routing comes into play whenever you want ...READ MORE

answered Feb 11, 2020 in Angular by anonymous
• 82,840 points
553 views
0 votes
1 answer

What is $watch() and it's use in AngularJS?

$watch() function is used to watch the ...READ MORE

answered Feb 3, 2020 in Angular by anonymous
• 82,840 points
2,478 views
0 votes
1 answer

What is $parse in Angularjs

Before we jump into the topic you ...READ MORE

answered Feb 4, 2020 in Angular by Niroj
• 82,840 points
2,533 views
0 votes
1 answer

What is so different about interpolate in AngularJS?

hii @kartik, In order to know about what ...READ MORE

answered Feb 4, 2020 in Angular by Niroj
• 82,840 points
1,580 views
+1 vote
1 answer

What is the relationship between angularjs Scope with controller/view?

Let us consider the below block: <div ng-controller="emp"> ...READ MORE

answered Jan 20, 2020 in Web Development by Niroj
• 82,840 points

edited Jan 21, 2020 by Niroj 1,143 views
+1 vote
1 answer

What is css box module?

Hey, All the element present in html follows ...READ MORE

answered Jan 20, 2020 in Web Development by Niroj
• 82,840 points

edited Jan 21, 2020 by Niroj 1,205 views
0 votes
3 answers

Explain the difference between visibility:hidden; and display:none?

display:none means that the tag in question will ...READ MORE

answered Dec 14, 2020 in Web Development by Gitika
• 65,770 points
119,702 views
+1 vote
1 answer

How to access the Angularjs scope of a particular html element from our console?

Hello, You should follow the below steps:-- 1.Compile and ...READ MORE

answered Jan 21, 2020 in Web Development by Niroj
• 82,840 points

edited Jan 21, 2020 by Niroj 2,969 views
0 votes
1 answer

What is $routeParams used for in Angularjs?

Angularjs routeParams is a service that allows ...READ MORE

answered Feb 7, 2020 in Angular by Niroj
• 82,840 points
2,908 views
0 votes
1 answer

What is routing in AngularJS?

Routing is just another way of fixing ...READ MORE

answered Feb 6, 2020 in Angular by Niroj
• 82,840 points
755 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP