AngularJS UI-router親テンプレートのURLをクライアントの状態から変更してください。

Question

私のルーティングにはui-routerが使用されています。親のtemplateUrlをクライアント状態（この場合は状態の編集）から動的に変更する方法を知りたいと思います。

angular.module('TestModule', ['ui.router']) 
.config(['$stateProvider', '$httpProvider', 
    function ($stateProvider, $httpProvider) { 
     'use strict'; 
     $stateProvider 
      .state('index', { 
       abstract: true, 
       views: { 
        '@': { 
         templateUrl: '/defaultLayout.html', 
         controller: 'layoutController' 
        }, 
       }] 
      }) 

      .state('login', { 
       parent: 'index', 
       url: '/login', 
       templateUrl: '/login.html', 
       controller: 'loginController' 
      }) 

      .state('edit', { 
       url: '', 
       parent: 'index', 
       //Change the templateUrl from defaultLayout.html to userLayout.html 

      }) 
      .state('edit.user', { 
       url: '/edit/user', 
       views: { 
        //code 
       } 

      }); 

    }]) 
.controller('layoutController', function() { }) 
.controller('layoutFluidController', function() { }) 
.controller('testCtrl', function() { 

}); 

これがどのように達成されるか教えてください。あなたの助けに感謝。ありがとうございました。

Answer 1

あなたは.state('index2', { })として別のテンプレートのURLを別の抽象親のINDEX2 'を使用し、以下のようにedit状態のために親としてこれを使用することができ、

angular.module('TestModule', ['ui.router']) 
.config(['$stateProvider', '$httpProvider', 
    function ($stateProvider, $httpProvider) { 
     'use strict'; 
     $stateProvider 
      .state('index', { 
       abstract: true, 
       views: { 
        '@': { 
         templateUrl: '/defaultLayout.html', 
         controller: 'layoutController' 
        }, 
       }] 
      }) 
      .state('index2', { 
       abstract: true, 
       views: { 
        '@': { 
         templateUrl: '/defaultLayout2.html', 
         controller: 'layoutController' 
        }, 
       }] 
      }) 

      .state('login', { 
       parent: 'index', 
       url: '/login', 
       templateUrl: '/login.html', 
       controller: 'loginController' 
      }) 

      .state('edit', { 
       url: '', 
       parent: 'index2', 
       //Change the templateUrl from defaultLayout.html to userLayout.html 

      }) 
      .state('edit.user', { 
       url: '/edit/user', 
       views: { 
        //code 
       } 

      }); 

    }]) 
.controller('layoutController', function() { }) 
.controller('layoutFluidController', function() { }) 
.controller('testCtrl', function() { 

});