如何使過濾元件獨特的採用了棱角分明

   <select ng-model="model" id="filter"> 
        <option value="" id="dropdownDefault">Title</option> 
        <option ng-repeat="select in selects" value="{{select.title}}" id="dropdown">{{select.title}}</option> 
       </select> 

       <select ng-model="model" id="filter"> 
        <option value="" id="dropdownDefault">Date</option> 
        <option ng-repeat="select in selects" value="{{select.schedule}}" id="dropdown">{{select.schedule}}</option> 
       </select> 

       <select ng-model="model" id="filter">; 
        <option value="" id="dropdownDefault">Category</option> 
        <option ng-repeat="select in selects" value="{{select.subcategory}}" id="dropdown">{{select.subcategory}}</option> 
       </select> 

       <select ng-model="model" id="filter">; 
        <option value="" id="dropdownDefault">Owner</option> 
        <option ng-repeat="select in selects" value="{{select.owner}}" id="dropdown">{{select.owner}}</option> 
       </select> 
       <input type="search" id="search" class="light-table-filter" data-table="table-striped" placeholder="Search..."> 
       <table class="table table-striped" style="text-align:left" id="contentTable"> 
        <thead> 
         <tr id="titel"> 
          <th style="display:none;">MainCategory</th> 
          <th>Category</th> 
          <th>Title</th> 
          <th>Date & Time</th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr ng-repeat="select in selects | filter:model"> 
          <td style ="display:none;">{{select.maincategory}}</td> 
          <td>{{select.subcategory}}</td> 
          <td><a href= "{{select.link}}"> {{select.title}}</a> </td> 
          <td>{{select.schedule}}</td> 
         </tr> 
        </tbody> 
       </table>

這是我的HTML文件的一部分。該數據的內容是由JavaScript文件上傳：

var myApp = angular.module('myApp', ['infinite-scroll']);myApp.controller('controller', function($scope) { 
$scope.selects = [ 
{ID: '0',maincategory: 'Entertainment',subcategory: 'Music',title: 'Zac Brown Band',link: 'xyz',schedule: 'Tuesday | 12:25AM ET',}, 
{ID: '1',maincategory: 'Sports',subcategory: 'Basketball',title: 'WNBA: Dallas @ Phoenix',link: 'xyz',schedule: 'Saturday | 12:25AM ET',}, 
{ID: '2',maincategory: 'Sports',subcategory: 'Basketball',title: 'WNBA: Phoenix @ San Antonio',link: 'xyz',schedule: 'Friday | 12:00AM ET',},];});

類別「籃球」在下拉菜單中顯示兩次。我怎樣才能使它獨特或獨特？

提前致謝！

來源

2017-09-23 Alex L

使用[Array＃filter（）]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter）或[angular $ filter]（https： //docs.angularjs.org/api/ng/service/$filter） – charlietfl

您不需要任何AngularJS功能來過濾掉重複項。你可以自己創建一個函數，也許使用filter，或者甚至使用圖書館裏的aavilabile解決方案，如lodash。可以使用uniqBy。在你的情況下，_.uniqBy($scope.selects, 'subcategory')將返回一個沒有子類別重複的數組。然後將這個結果數組綁定到你的模板。

來源

2017-09-24 07:47:28

如何使過濾元件獨特的採用了棱角分明

回答

相關問題