Angular 5中@angular/http的URLSearchParams类的替代方案是什么？

嘿，我刚好碰到过类似的情况！在Angular 5及以后的版本里，@angular/http中的URLSearchParams确实被标记为弃用了，不过不用慌，有两个完全符合你现有使用习惯的替代方案，而且都不需要引入冗余的AppRoutingModule：

方案1：直接使用浏览器原生URLSearchParams #

这个方案和你原来的代码几乎完全一致，因为Angular之前的URLSearchParams本来就是对浏览器原生API的封装。你不需要导入任何Angular模块，直接用全局的URLSearchParams即可：

constructor() {
  // 用法和之前完全相同，只是不用从@angular/http导入了
  const urlSearchParams = new URLSearchParams(window.location.search.substring(1));
  this.custno = urlSearchParams.get('custno');
  this.plan = urlSearchParams.get('plan');
}

现代浏览器对原生URLSearchParams的支持非常好，完全能满足你的需求。

方案2：使用Angular官方推荐的HttpParams #

如果你更倾向于使用Angular提供的工具类，可以用@angular/common/http里的HttpParams，它是官方指定的替代类，用法也很接近：

首先导入类：

import { HttpParams } from '@angular/common/http';

然后修改你的构造函数代码：

constructor() {
  const params = new HttpParams({ fromString: window.location.search.substring(1) });
  this.custno = params.get('custno');
  this.plan = params.get('plan');
}

这里通过fromString参数直接传入查询字符串，get方法的使用和之前的URLSearchParams完全一致，非常容易迁移。

这两个方案都不需要依赖路由模块，完美适配你的场景，选哪个都可以～

内容的提问来源于stack exchange，提问作者ASantoli