2017-03-07 6 views
0

私は、ブラウザで次のURLを入れて/要求する場合$ routeProvider維持するためにどのようにパスとクエリ文字列パラメータは

$routeProvider   
     .when('/users/edit', { 
      templateUrl: 'components/user-management/view-users/view.html' 
      controller: 'viewUsersCtrl'    
     }) 
     .when('/users/edit/:id', { 
      templateUrl: 'components/user-management/edit-user/view.html' 
      controller: 'editUserCtrl' 
      reloadOnSearch: false      
     }) 
     .otherwise {redirectTo: '/'} 

を使用して定義次のルートでAngularJSアプリケーションを持っている

webapp/#/users/edit/3 

はユーザーの詳細を取得しますが、ブラウザの更新ボタンを押すと、次のURLが引き継がれます。

webapp/#/users/edit/:id 

これはユーザーにはなりません。

パス/クエリ文字列変数をどのように保持して、リフレッシュボタンを押しても同じままになるようにしますか?

答えて

0

私はすでに私のangular.run方法でそれを実現しています

$routeScope.$on("$routeChangeStart", function(e, next, current) { 
    $rootScope.queryString = $location.search() 
}) 

$routeScope.$on("$routeChangeSuccess", function(e, next, current) { 
    $location.search($rootScope.queryString); 
}) 
0

それは代わりに$ routeProviderの$ stateProviderを使用することをお勧めします:index.htmlを

(function() { 

    var app = angular.module("myApp", ["ui.router"]); 

    app.config(function($stateProvider) {   

     var users = { 
       name: 'users', 
       url: '/users',  
       templateUrl: 'users.html' 
      },   
      viewUsers = { 
       name: 'view-user',   
       url: '/edit', 
       parent: users, 
       templateUrl: 'view-users.html' 
       //controller: 'viewUsersCtrl'    
      }, 
      editUser = { 
       name: 'edit-user',   
       url: '/:id', 
       parent: viewUsers, 
       templateUrl: 'edit-user.html' 
       //controller: 'eidtUsersCtrl'    
      }; 

     $stateProvider.state(users); 
     $stateProvider.state(viewUsers); 
     $stateProvider.state(editUser); 
    });  

})(); 

<!DOCTYPE html> 
<html> 
    <head> 
     <title>UI-ROUTER</title> 
     <meta charset="UTF-8">   
     <script src="js/angular.min.js"></script> 
     <script src="js/angular-ui-router.js"></script> 
     <script src="js/app.js"></script> 
    </head> 

    <body ng-app="myApp"> 
     <a href="#" ui-sref="users">Users</a>    
     <div ui-view></div> 
    </body> 
</html> 

users.html

<h3>users</h3> 
<div ui-view></div> 

ビュー-users.html

<h3>VIEW USER</h3> 
<div ui-view></div> 

編集user.html

<h3>EDIT USER</h3> 
+0

できますが、 $ stateProviderを使用して私の問題を解決する方法を教えてください。おそらくあなたはいくつかのコードを表示できますか?ありがとう。 – imprezzeb

+0

$ stateProvider – Faly

+0

さんのご協力ありがとうございます。しかし、ページの更新時にクエリ文字列やパス変数は保持されません。 – imprezzeb

関連する問題