如何使用Angularjs中的单独视图进行搜索？

Question

如何让索引页接受搜索输入，然后用angularjs将结果返回到不同的页面（视图）？

我在互联网上浏览过的所有教程都显示接受查询并立即在同一页面下打印结果的搜索框（或者说MVC语言中的“视图”）。我想要一个单独的页面来保存搜索框，让用户输入它想要的内容，然后点击go按钮，然后将结果返回到一个单独的页面（它没有搜索框）。

Answer 1

您需要在进入第二页之前在某处存储搜索框的值。你可以用几种方法来做到这一点。

---

一种方法是使用服务来存储值，然后结果页可以从那里检索它。

服务：

.service('CommonService', function(){ 
    this.value = ''; 
}); 

的搜索控制器：

.controller('search', function(CommonService){ 
    $scope.goToResult = function(searchBoxValue){ 
    CommonService.value = searchBoxValue; 
    // Redirect to result view 
    }; 
}); 

此功能可以在搜索表单的ng-submit。

结果控制器：

.controller('result', function(CommonService){ 
    // Receive value of search box 
    $scope.receivedValue = CommonService.value; 
}); 

---

另一种方式是沿着URL发送价值，如GET PARAMS：

http://google.com/q?SearchBoxValue=something-i-wrote-before 

Answer 2

你实现单页应用（SPA） ？您可以通过部分视图以多种方式执行此操作，并使用结果页面覆盖搜索页面上的部分视图。

1. 搜索页面（部分）命中发送请求以获取数据。
2. 从服务接收数据
3. 重定向到结果（局部视图）。
4. 你完成了。

希望这对你有所帮助。