如何使用AngularJS初步過濾客戶端上的數據？

-1

我是Angular的新成員，剛剛在你的MVC網站上使用過Angular的課程。我現在試圖採取培訓中顯示的內容，並嘗試在我已完成的一個小網站中實施它。我有一個要求，培訓沒有解決，我不確定如何包含在我的代碼中。如何使用AngularJS初步過濾客戶端上的數據？

這是一家小公司在離開消息時跟蹤客戶呼叫的網站。記錄可以處於許多狀態之一，如打開，關閉，進行中，需要回撥等。

當頁面啓動時，我調用一個返回所有記錄的Web服務。但是，我希望它最初通過「OPEN」進行過濾，並只顯示直到從下拉列表中選擇另一個過濾器。所以默認狀態是「1」或「OPEN」。

什麼是在頁面加載後過濾記錄的好方法？我假設我需要某種財產，如vm.FilterId 我最初將設置爲「1」，然後下拉列表將更改該值？

我將如何去過濾客戶端上的數據？

以下是我的名爲「call.controller.js」的angualr文件中的API調用。

function callList(){ 
    dataService.get("/api/Call") 
    .then(function(result) { 
     vm.calls = result.data; 
    }, 
    function (error) { 
     handleException(error) 
    }); 
}

這是我的重複，我把我的標記放在表標記內。我假設這可能是我想嘗試做某種過濾的地方？

<tr ng-repeat="call in vm.calls">

UPDATE

從什麼我瞭解我應該可以做這樣的事情最初篩選？這沒有任何回報。狀態字段是一個整數。

<tr ng-repeat="call in vm.calls | filter:{ status: 1}">

我可以看到來自API的值。

來源

2017-01-23 Caverman

文檔：https://docs.angularjs.org/guide/filter – Claies

謝謝，我也會看看這個。 – Caverman

您可以使用管道過濾ng-repeat指令。

選項1：

<div ng-repeat="call in vm.calls | filter:{ open: value}">

選項2：

Value source: <input type="text" ng-model="search.open"> 
<div ng-repeat="product in products | filter:open">

您可以檢查例如here

來源

2017-01-23 20:33:07 doriak

謝謝，我認爲這會是一些相似的事情，但不知道如何實現它。我會看看你有的選項1，我假設「開放」將是我將在我的角度文件中設置的屬性？那麼我會默認爲「1」，並將我的下拉列表綁定到該屬性？ – Caverman

打開，是您從服務中獲得的對象的屬性。過濾器將對對象的開放字段和您放置的值進行比較。該值可以是一個模型屬性，可以像你說的那樣通過下拉列表進行更改。 – doriak

我在我的初始文章中添加了更新。根據您的建議和我迄今爲止研究的內容，我提出了這個問題，但它沒有顯示任何內容。。你有沒有看到任何會阻止它工作的東西？ – Caverman

如何使用AngularJS初步過濾客戶端上的數據？

回答

相關問題