Tuesday, 1 May 2018

027 AngularJS Routing

AngularJS Routing

AngularJS is a single page application (SPA). ngRoute  directive  route the application within a single page. ngRoute  module  help to navigate between pages , link without reloading the page.
.The routing is completely based on URL,  when is specific URL are requested, ngRoute  render the view  defined as per routing rules.


Example :

<html>
          <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
           <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>

<body ng-app="myApp">

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

<a href="#!C#">C# Tutorial</a>
<a href="#!Javscript">Javscript Tutorial</a>
<a href="#!AngularJS">AngularJS Tutorial</a>



<div ng-view></div>

<script>

var app = angular.module("myApp", ["ngRoute"]);

      app.config(function ($routeProvider) {
          $routeProvider
          .when("/", {
           templateUrl: "Home.html"
          })

          .when("/C#", {
           templateUrl: "C#.html"
          })


          .when("/Javscript", {
           templateUrl: "Javscript.html"
        });

         .when("/AngularJS", {
           templateUrl: "AngularJS.html"
        });

});
</script>

</body>
</html>


No comments:

Post a Comment

বাঙালির বেড়ানো সেরা চারটি ঠিকানা

  বাঙালি মানে ঘোড়া পাগল | দু একদিন ছুটি পেলো মানে বাঙালি চলল ঘুরতে | সে সমুদ্রই হোক , পাহাড়ি হোক বা নদী হোক। বাঙালির ...