如何通過angularjs中的查詢參數重定向url？

Question

我使用angularjsngRoute委託不同的HTML模板，例如：

phonecatApp.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/phones', { 
     templateUrl: 'partials/phone-list.html', 
     controller: 'PhoneListCtrl' 
     }). 
     when('/cars', { 
     templateUrl: 'partials/car-detail.html', 
     controller: 'CarDetailCtrl' 
     }); 

    //many more routes 
    }]); 

問題：我想有一個共同的URL，如localhost/my-app?myparam=Nokia。

我想比較myparam到映射表。如果參數名稱是電話公司，我想要委託給/phones。如果是汽車公司，我想代表/cars等。你明白了。

此外我必須重寫URL如下：localhost/myapp/phones?myparam=Nokia。因此ngRoute會自動捕獲正確的模板和控制器。

問題：如何攔截初始加載，並根據url參數重定向？

旁註：我不能重寫routeProvider配置，例如通過使用不同的插件，如angular-ui-router。

Answer 1

這聽起來像你可能想退後一步並重新考慮你爲什麼試圖以這種方式來解決它，但考慮到你的限制，你最好的選擇可能是讓一個服務返回正確的URL並從控制器調用它：

phonecatApp.controller("trafficCtrl", function ($routeParams,trafficService,$location) { 
    if ($routeParams.myparam) { 
     var destination = trafficService.getDestination($routeParams.myparam); 
     $location.path(destination); 
    } 
}) 
.service("trafficService", function() { 
    this.getDestination = function (paramValue) { 
     switch(paramValue) { 
      case "Nokia": 
       return "/phones"; 
      case "Ford": 
       return "some/car/url"; 
      // etc... 
     } 
    } 
}); 

另外，你必須添加fol降脂（通用）途徑向供應商：

$routeProvider.when("/", { 
     template: '', 
     controller: 'trafficController' 
}); 

Answer 2

我不知道這是否是正確的解決方案。但是你可以創建一個新的路線/myapp ..寫控制器和重定向使用$location服務..使用$location.query()找到查詢段值之後，並相應地重定向它

Answer 3

如果我們讓一個REST調用，比如/我的應用程序內/諾基亞或我的應用程序內/三星，而不是查詢參數，我想我們可以動態路由它在配置本身。

phonecatApp.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/my-app/:myparam', { 
     templateUrl: function(params){ 
     return TemplateMappingFunction(params.myparam) +'.html' 
    }, 
     controller: function(params){ 
     return ControllerMappingFunction(params.myparam) 
    } 
     }) 

    //many more routes 
    }]); 

例如，

• 如果URL /我的應用程序內/諾基亞，TemplateMappingFunction（諾基亞）將返回的諧音/電話list.html」，
• 如果URL如果URL是/my-app/BMW，TemplateM是/my-app/Nokia，TemplateMappingFunction（諾基亞）將返回partials/phone-list.html'，
• appingFunction（BMW）將返回的諧音/汽車details.html」，

查詢帕拉姆方法

phonecatApp.config(['$routeProvider', 
      function($routeProvider) { 
      /* Function to retrieve Query parameters*/ 
      function getParameterByName(name) { 
       name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); 
       var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), 
        results = regex.exec(location.search); 
       return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); 
      } 

      $routeProvider. 
       when('/my-app', { 
       templateUrl: TemplateMappingFunction(getParameterByName('myparam')) 
      }, 
       controller: ControllerMappingFunction(getParameterByName('myparam')) 
      } 
       }) 

      //many more routes 
      }]); 

因此，如果URL是本地主機/我的應用程序內？myparam =諾基亞 ，那麼TemplateMappingFunction（'Nokia'）將返回'partials/phone-list.html'