templates/Cookbook/5-DeepLinking.html.ep

   1 <script>
   2 angular.service('myApplication', function($route){
   3   // define routes
   4   $route.when("",          {template:'/cb/welcome.html',  controller:WelcomeCntl});
   5   $route.when("/settings", {template:'/cb/settings.html', controller:SettingsCntl});
   6
   7   // initialize the model to something useful
   8   this.person = {
   9    name:'anonymous',
  10    contacts:[{type:'email', url:'anonymous@example.com'}]
  11   };
  12  }, {inject:['$route']});
  13
  14  function WelcomeCntl(){}
  15  WelcomeCntl.prototype = {
  16   greet: function(){
  17    alert("Hello " + this.person.name);
  18   }
  19  };
  20
  21  function SettingsCntl(){
  22   this.cancel();
  23  }
  24  SettingsCntl.prototype = {
  25   cancel: function(){
  26    this.form = angular.copy(this.person);
  27   },
  28
  29   save: function(){
  30    angular.copy(this.form, this.person);
  31    window.location.hash = "#";
  32   }
  33  };
  34 </script>
  35 <h1>Your App Chrome</h1>
  36 [ <a href="#">Welcome</a> | <a href="#/settings">Settings</a> ]
  37 <hr/>
  38 <span style="background-color: blue; color: white; padding: 3px;">
  39   Partial: {{$route.current.template}}
  40 </span>
  41 <div style="border: 1px solid blue; margin: 0;">
  42   <ng:include src="$route.current.template" scope="$route.current.scope"></ng:include>
  43 </div>
  44 <small>Your app footer </small>