1. Install ui-route, include js file in html and add dependence in js file.

bower install angular-ui-router

angular.module('Eggly', [    'ui.router',    'categories',    'categories.bookmarks'])

 

2. Add config() to the app, inject with $stateProvider.

angular.module('Eggly', [    'ui.router',    'categories',    'categories.bookmarks'])    //inject the stateProvider    .config(function($stateProvider){        $stateProvider            .state('eggly', {                url:'/',   //point to the root url                templateUrl: 'app/categories/categories.tmpl.html',                controller: 'MainCtrl'            })        ;    })

 

3. add ui-view directive to the html

 

4. Add content to the 

categories.tmpl.html

     
    
      
        
               
       
            
        
                                    {
    {category.name}}                            
        
       
    
      
    
      
        
       
            
        ×            
                                
        {
   {bookmark.title}}        
       
        
       
        
               
       
            
                                        Create Bookmark                        
        
                
         
                    
          Bookmark Title                    
                          
         
                
         
                    
          Bookmark URL                    
                          
         
                
         Create                
         Cancel            
        
        
       
        
               
       
            
        
Editing {
   {editedBookmark.title}}
            
        
                
         
                    
          Bookmark Title                    
                          
         
                
         
                    
          Bookmark URL                    
                          
         
                
         Save                
         Cancel            
        
        
       
    
      
     

 

5. When visiting the page, url should change accordingly, otherwise nothing will show.

old url:http://localhost:63342/eggly/index.start.html

new url:http://localhost:63342/eggly/index.start.html#/

 

Read More: