angularjs - Angular $location.path 没有按预期工作

Question

我使用带参数的 $location.path 触发 URL 更改，但是这些参数不会传递到目标页面。

我的源页面是 sidebar.html，我的目标页面是dashboard.html。

在我的 sidebar.html 中，我渲染了一个 Kendo UI Treeview 小部件，如下所示:

<span id="treeview" kendo-tree-view="tree" 
            style="color:white;"
            k-template="vm.treeItemTemplate"
            k-options="vm.treeOptions"
            k-data-source="vm.reportsTree"
            k-on-change="vm.onTreeSelect(kendoEvent)">
 </span>   

在我的 sidebar.js 中，我使用 单击事件 设置 vm.treeItemTemplate :

vm.treeItemTemplate = "<a href='\' ng-click='vm.treeItemClick(this)'> {{dataItem.text}} </a>";

然后一旦我点击浏览器中的 Treeview 项，我就会触发 vm.treeItemClick 事件来更改 URL 并发送“reptname”参数:

vm.treeItemClick = function (item) {
        console.log("tree view clicked !");
        $location.path('/index.html').search({reptname:'MTM'});
}

这很痛苦，我希望得到一些建议。

我需要在我的左侧导航栏中使用 Kendo Treeview 对象来允许用户选择各种报告选项，这些选项又将重定向到具有特定“reptname”参数值的dashboard.html。

现在，当我在 sidebar.js (使用 Chrome 开发工具)中打破 $location.path() 时，我清楚地看到 $location 对象上的正确 URL 属性。

$location
LocationHashbangUrl {$$protocol: "http", $$host: "localhost", $$port: 49479, $$parse:  function,       $$compose: function…}
$$absUrl: "http://localhost:49479/index.html#/index.html?reptname=MTM"
$$host: "localhost"
$$parse: function (url) {
$$path: "/index.html"
$$protocol: "http"
$$replace: false
$$rewrite: function (url) {
$$search: Object
$$url: "/index.html?reptname=MTM"
__proto__: Object

但是，一旦它被重定向到dashboard.html(在我的路由中定义为 url:"/")，我在 $location 对象和 $routeParams 对象中都看不到参数列表。

这就是我被卡住的地方!

- - - 更新 - - - -

当我使用参数手动刷新 index.html 页面时，$location 对象包含参数。

前/URL: Link entered manually

但是，如果我使用 $location.path('/index.html').search({reptname:'MTM'}); 从 sidebar.js 重定向，我将一无所获!

Answer 1

如果您在控制台中看到该参数但在执行代码中没有看到，这可能是因为 Chrome 倾向于稍微延迟评估 console.log，足以让异步请求完成并填充数据，因此它不是可靠的调试方式。

您可以监听要触发的 $viewContentLoaded 事件，然后检查路径吗？即 View 已完全加载并且应设置所有变量(包括 $location.path())