angularjs - 防止垃圾邮件历史记录中的搜索更改

Question

我正在使用类似 #!/OrderList?id=123 的链接, 显示所有订单的列表和订单 123 的更多详细信息。与 reloadOnSearch=false并观看 $routeUpdate它工作正常，除了一件事:所有此类链接都会放入浏览器历史记录中，而我更喜欢那里只有一个此类链接。例如，代替

#!/OrderList?id=123
#!/OrderList?id=124
#!/OrderList?id=125
#!/AnotherList?id=678
#!/AnotherList?id=679

只是每个组的最后一个成员，即

#!/OrderList?id=125
#!/AnotherList?id=679

我知道 $location.replace() ，但是当通过链接发生更改时，我无法看到将其放置在哪里。我试着把它放在 $scope.$on("$routeUpdate", ...) ，但它什么也没做，可能是因为当路线已经改变时为时已晚。

我没有使用 router-ui也不是 HTML5 模式(只是普通的 angular-route )。

恐怕，我不清楚我坚持使用 href而不是自定义处理程序。我希望链接可以与鼠标中键和书签以及所有内容一起使用。 ng-href的组合和 ng-click可能会做我想做的事，但我找到了 simple solution使用普通链接。

Answer 1

看起来您可能希望使用 ng-click 函数而不是依赖链接来更新 URL 查询参数，然后调用如下所示的函数来更新参数...使用替换状态，历史记录应该只跟踪当前值(value)。我还没有测试过这个案例，所以如果你尝试一下，让我知道它是否有效。

        function changeUrlParam (param, value) {
            var currentURL = window.location.href;
            var urlObject = currentURL.split('?');
            var newQueryString = '?';

            value = encodeURIComponent(value);

            if(urlObject.length > 1){
                var queries = urlObject[1].split('&');

                var updatedExistingParam = false;
                for (i = 0; i < queries.length; i++){
                    var queryItem = queries[i].split('=');

                    if(queryItem.length > 1){
                         if(queryItem[0] == param){
                            newQueryString += queryItem[0] + '=' + value + '&';
                            updatedExistingParam = true;
                         }else{
                            newQueryString += queryItem[0] + '=' + queryItem[1] + '&';
                         }
                    }
                }
                if(!updatedExistingParam){
                    newQueryString += param + '=' + value + '&';
                }
            }else{
                newQueryString += param + '=' + value + '&';
            }
            window.history.replaceState('', '', urlObject[0] + newQueryString.slice(0, -1));
        }