javascript - $location.search() 在 Angular 7 中等效

Question

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

在服务中注入(inject)了$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+ 中，存在三种不同类型的参数，因此您的第一步是定义所需的类型。

这是一篇详细描述不同类型的文章:

Send data through routing paths in Angular

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

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

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

或者像这样的代码:

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