用于动态网址的AngularJS路由,如何?

时间:2013-07-11 13:56:49

标签: angularjs routing angularjs-routing

我试图了解如何配置我的angularJS路由,给出以下情况:

我们有一个搜索页面,我们根据提供的标签显示搜索结果(1..n标签)。我们希望用户能够解析输入网址作为以下内容和我们的系统进行搜索并显示相应的结果。

网址格式应为:

http://mywebsite.com/search/<term1>/<term2>/<termN> ...所以它可能是不同数量的术语。

我正在研究提供的路线,并且无法找到一种动态的方法。

我看到我可以放入routeprovid:

.when('/search/:searchParams',...但只有当我有一个词时才会处理...无论如何要将它配置为采用给定的多个术语?

3 个答案:

答案 0 :(得分:0)

这对你有帮助吗?似乎支持动态路由,您可能可以将:name参数切除,以执行您希望的操作。

http://gregorypratt.github.io/AngularDynamicRouting/

答案 1 :(得分:0)

您可以尝试base64ing您的searchParams:

.when('/search/:searchParams', {controller:'SearchCtrl'})

function SearchCtrl($routeParams, $location){
    //Assuming your params are an array like ['param1', 'param2', 'param3']
    //You could easily adapt this to base64 a JSON object
    function encodeParams(params){
        return window.btoa(params.join(';'));
    }

    function decodeParams(string){
        return window.atob(string).split(';');
    }

    var searchParams = decodeParams($routeParams.searchParams);

    scope.search = function(params){
        $location.path('/search/' + encodeParams(params));
    }
}

答案 2 :(得分:0)

我的解决方案可能看起来不那么高兴,但它至少可以起作用:

您可以按照

的方式组织路径
yoursite.com/term1Name/**:param1**/term2Name/**:param2**/term3Name/**:param3**

为了清楚起见,您可能会将路线看作REST路线。例如,我想要一个服务列表:

www.yoursite.com/servises/

转到其中一项服务:

www.yoursite.com/servise/:id

如果我想看一些服务细节,我会这样做:

www.yoursite.com/servise/:id/details

等等

www.yoursite.com/servise/:id/detail/:id