Angular.JS使用選擇下拉列表中的選項過濾項目

Question

使用WP API我將輸出到JSON文件的頁面上的帖子列表。我試圖使用輸入字段和兩個選擇過濾這些帖子。目前，我可以通過輸入字段（searchrecipe）過濾帖子，當我搜索可以正常工作的帖子標題時。

我不確定如何做的是過濾帖子，當我從其中一個選擇選擇一個選項。有兩個選擇，一個包含所有使用的標記，另一個包含所有類別。

所以要清楚，我的問題是我不知道如何篩選帖子，當我從選擇下拉列表中選擇一個選項。

任何幫助將是偉大的。謝謝！

Search: <input ng-model="searchrecipe"> 

<select ng-model="categories" ng-options="category.name for category in categoryList"></select> 
<select ng-model="tags" ng-options="tag.name for tag in tagsList"></select> 

<article ng-repeat="post in posts | filter:searchrecipe"> 
    <h3> 
     <a href="{{ post.link }}"> 
      {{ post.title }} 
     </a> 
    </h3> 
    <p ng-repeat="category in post.terms.category"> 
     {{category.name }} 
    </p> 
    <p ng-repeat="tag in post.terms.post_tag"> 
     {{ tag.name }} 
    </p> 
</article> 

Answer 1

只需更換您的HTML：

 Search: <input ng-model="searchrecipe"> 

    <select ng-model="category" ng-options="category.name for category in categoryList"></select> 
    <select ng-model="post_tag" ng-options="post_tag.name for post_tag in tagsList"></select> 

    <article ng-repeat="post in posts | filter:searchrecipe | filter:category.name | filter:post_tag.name "> 
     <h3> 
      <a href="{{ post.link }}"> 
       {{ post.title }} 
      </a> 
     </h3> 
     <p ng-repeat="category in post.terms.category"> 
      {{category.name }} 
     </p> 
     <p ng-repeat="tag in post.terms.post_tag"> 
      {{ tag.name }} 
     </p> 
    </article>