angular – 从表单控件写入浏览器URL

2023年9月28日 200次阅读

参见英文答案 >
Change route params without reloading in angular 2                                    7个

我有一个角度表,在标题上方有一些搜索框.当用户在搜索框中键入时,将过滤相关列.

我想将搜索框中的值直接写入URL,以便用户键入和更改搜索条件时,URL中的参数会自动更新.如果用户书签或共享URL,或者在历史中导航和导航URL,则使用先前的搜索参数.

我查看了router docs,但我看到写入URL的唯一方法是导航到它.我不希望路由,警卫和导航事件只是在搜索表单和URL参数之间进行更直接的绑定.

我正在使用Angular 6.1.3.我可以在角度内做这个,还是我需要去幕后尝试绕过它？

我认为使用RouteReuseStrategy可以节省一些渲染时间,如果我正在导航但我不确定它是否足够.

最佳答案 你在寻找
Location#replaceState(强调我的)：

Changes the browsers URL to the normalized version of the given URL, and replaces the top item on the platform’s history stack.

只要有变化就调用此函数：

ngOnInit () {
  this.form.get('field').changes.subscribe(value => {
    this.location.replaceState('search/' + value)
  })
}
点赞