AngularJS Route

ngRoute

by Sajeetharan Sinnathurai

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular-route.js"></script>
<div ng-controller="outsideCtrl">
    <ul>
        <li><a href="#/1">Link 1</a></li>
        <li><a href="#/2">Link 1</a></li>
        <li><a href="#/3">Link 3</a></li>
    </ul>
    <div>
         <div ng-view></div>
    </div>
</div>

<script type="text/ng-template" id="1.html">
  Add
</script>
<script type="text/ng-template" id="2.html">
 Edit
</script>
<script type="text/ng-template" id="3.html">
Delete
</script>

JavaScript

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

myApp.controller('outsideCtrl', function($scope, $log) {

});

myApp.controller('MyCtrl', function($scope, $log) {
    
});

myApp.config(function($routeProvider) {
    $routeProvider
    .when( '/1', { templateUrl: '1.html',controller: 'MyCtrl' } )
    .when( '/2', { templateUrl: '2.html',controller: 'MyCtrl' } )
    .when( '/3', { templateUrl: '3.html',controller: 'MyCtrl' } )
    .otherwise( { redirectTo: '/1' } );
});


myApp.directive('a', function($log,$route,$location){
    return {
        restrict: 'E',
        link: function(scope, element, attrs){
            element.bind('click', function(e) {
                if(attrs.href.split('#')[1] == $location.path()){
                    // Reload
                    $log.info('Reload si meme URL');
                    $route.reload();
                }
            });
        }
    };
});