2015-09-27 38 views
0

如何讓索引頁接受搜索輸入,然後用angularjs將結果返回到不同的頁面(視圖)?如何使用Angularjs中的單獨視圖進行搜索?

我在互聯網上瀏覽過的所有教程都顯示接受查詢並立即在同一頁面下打印結果的搜索框(或者說MVC語言中的「視圖」)。我想要一個單獨的頁面來保存搜索框,讓用戶輸入它想要的內容,然後點擊go按鈕,然後將結果返回到一個單獨的頁面(它沒有搜索框)。

+2

使用兩個控制器之間的共享服務,並在執行搜索後將結果分配到服務中。然後做一個重定向'$ location.path('/ second_view');' –

回答

0

您需要在進入第二頁之前在某處存儲搜索框的值。你可以用幾種方法來做到這一點。


一種方法是使用服務來存儲值,然後結果頁可以從那裏檢索它。

服務:

.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 
0

你實現單頁應用(SPA) ?您可以通過部分視圖以多種方式執行此操作,並使用結果頁面覆蓋搜索頁面上的部分視圖。

  1. 搜索頁面(部分)命中發送請求以獲取數據。
  2. 從服務接收數據
  3. 重定向到結果(局部視圖)。
  4. 你完成了。

希望這對你有所幫助。