带查询字符串参数的角度ui路由器空白页

我一直在处理这个查询字符串参数问题很长一段时间，如果去/一切正常，但如果尝试像/?anything这样就不会工作，这些是我的两个国家，每个国家都有自己的文件。带查询字符串参数的角度ui路由器空白页

var access = accessConfig.accessLevels; 
$stateProvider.state('store', { 
    abstract: true, 
    templateUrl: 'store/main.html', 
    data: { 
    access: access.user 
    } 
}); 

$stateProvider.state('store.home', { 
    url: '/?cart', 
    views: { 
    '': { 
     templateUrl: 'store/home/home.html', 
     controller: 'store.home as vm' 
    } 
    }, 
    data: { 
    title: 'Home' 
    } 
});

每当我去/我得到预期的结果没有问题，但如果我尝试去/?cart或/?anything我得到一个空白页，我有一个stateChangeStart事件被称为只要我去/但当我去/?anything事件甚至没有被解雇。

顺便说一句，我正在使用html5mode(true)，发生了什么事情的任何线索？

它适用于使用ui-sref，但如果直接在地址栏中复制/粘贴网址，则不起作用。

来源

2015-03-03 Gustavo

我创建了working plunker here。它表明，这种情况和国家定义是正确的。

我们只是必须确保，即cart参数提供值。这些例子都可以工作，因为我们通过车PARAM：

<a ui-sref="store.home({cart:458})"> 
<a ui-sref="store.home({cart:'xyz'})">

因为plunker环境需要一些<base href=""来提供，我也使其与href工作有：

<div ng-controller="appCtrl" > 
    <a href="{{path}}?cart=abc"> 
    <a href="{{path}}?cart=123"> 
    ...

其中path是：

.controller('appCtrl', ['$scope',function($scope) { 
    $scope.path = document.location.pathname; 
}])

检查全部here，与html5Mode启用

EXTEND

表明，当我们想通过地址栏通过PARAMS这是工作，甚至，我在这里创造一个特殊的plunker

http://run.plnkr.co/plunks/syVPqrhNZpQJDdcCxx9b/?cart=myTestParam

，因为我们可以看到，它通过参数/?cart=myTestParam，我们可以看到在这个模板中：<pre>{{$stateParams | json}}</pre>：

{ 
    "cart": "myTestParam" 
}

你可以看到这里的代码

http://plnkr.co/edit/syVPqrhNZpQJDdcCxx9b?p=catalogue

代码

重要的部分是<head>部分，并与HTML5模式的正确设置的基础元件

：

$locationProvider.html5Mode({enabled: true, requireBase: true});

来源

2015-03-03 06:56:13

t hanks Radim，我忘了说它使用链接，但不使用直接访问，如打字，复制/粘贴'/？cart = open'，然后按回车。 – Gustavo 2015-03-03 16:02:34

@Gustavo，我为你创建了一个我的潜水者版本，可以直接访问地址栏。你可以输入你喜欢的任何参数，看看这些东西是如何工作的。希望它有帮助 – 2015-03-03 17:09:47

非常感谢Radim，我看到你的代码完美工作，但我的不是，这可能是别的。 – Gustavo 2015-03-03 18:16:40

带查询字符串参数的角度ui路由器空白页

回答

相关问题