$location.search() 相当于 Angular 7

Question

我正在将 Angular JS 迁移到 Angular 7。我正在查看这段代码并尝试在 Angular 7 中实现。

在服务中注入了

$location

，以下方法重新设置查询参数。

function resetAllOptions() {
            // Clears query params
            $location.search('');

}

function setQueryParameters() {
    // Sets query parameters
            $location.search({
                searchType: searchType,
                searchField: searchField,
                searchValue: searchValue,
                searchValueTwo: searchValueTwo,
                searchValueThree: searchValueThree
            });
}

如何在 Angular 7 中实现它？

Answer 1

参数在 Angular v7 中完全不同，因为它们是路由的一部分。因此，没有直接的线与线等同于您要完成的任务。

在 Angular v2+ 中，有三种不同类型的参数，所以你的第一步是定义你想要的类型。

这是一篇详细描述不同类型的帖子：

在 Angular 中通过路由路径发送数据

假设您想坚持使用查询参数：

您可以像这样在 HTML 中设置它们：

          <a [routerLink]="[product.id]"
             [queryParams]="{filterBy: listFilter, showImage: showImage}">
            {{ product.productName }}
          </a>

或者在这样的代码中：

this.router.navigate([`/search`],
              {queryParams: {
                     searchType: searchType,
                     searchField: searchField, // ...
               }});

Answer 2

这里是

$location.search()

的源代码：

https://github.com/angular/angular.js/blob/47bf11ee94664367a26ed8c91b9b586d3dd420f5/src/ng/location.js#L560-L591