Route Example

by Willian Tamagi

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
<script type="text/ng-template" id="embedded.home.html">
    <h1> Home </h1>
</script>

<script type="text/ng-template" id="embedded.about.html">
    <h1> About </h1>
    <div ng-show="error">
    	{{error}}
    </div>
    <div ng-show="success">
    	{{success}}
    </div>
</script>

<div ng-controller="myController"> 
      <div id="navigation">  
      <a href="#/home">Home</a>
      <a href="#/about">About</a>
      </div>
    
    <div ng-view></div>
</div>

JavaScript

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

myApp.config(['$routeProvider', function ($routeProvider) {
    $routeProvider.
    when('/home', {
        templateUrl: 'embedded.home.html',
        controller: 'HomeController'
    }).
    when('/about', {
        templateUrl: 'embedded.about.html',
        controller: 'AboutController'
    }).
    otherwise({
        redirectTo: '/home'
    });
}]);

myApp.controller('myController', function ($scope) {
	$scope.error = 'ERRO TESTE!';
  $scope.success = null;
  
  //ou
  //$scope.error = null;
  //$scope.success = 'SUCCESS TESTE!';
});

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

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