Question

我正在尝试在Angular2中实现搜索。

我们想要搜索，它将从Rest服务获得结果。我们想要动态地实现它，所以当用户键入超过5个字符时，它应该进行搜索。

有多个例子（来自Angular2网站的Hero的例子），我们能够实现这一目标。但我们唯一的问题是后退按钮不起作用。

由于尺寸原因，我们无法进行预取。

因此，我们使用路由器和搜索按钮实现。因此，当我们单击搜索按钮时，我们进行搜索并传递为URL可选参数，我们从参数中获取结果。这也有效。

但是我真的不知道如何在没有搜索按钮的情况下使用动态提取来实现搜索。我们也想让后退按钮工作。

我们怎样才能实现这个目标？

Answer 1

但我真的不知道如何在没有搜索按钮的情况下使用动态提取来实现搜索。

网上有几个这样的例子，但是通常搜索到api就像这样：

//in HTML
<input id="searchInput" type="text"/>
{{search$ | async}}

 //in component
 let searchInput = document.querySelector('#searchInput');

    let search$ = Observable.fromEvent(searchInput, 'input') // create observable from input events
                            .debounceTime(500) // wait 500 milliseconds
                            .map(e => e.target.value) // extract the input value
                            .switchMap(value => http.get('url?search=' + value)); //switch to another obs and return it, in Angular would be the http call

Angular2搜索动态结果

1 个答案: