2014-12-10 40 views
0

我想通過ng-click在單選按鈕上創建一個Angular過濾器,比較兩個單獨的JSON對象並返回對象,如果該值在ng-repeat列表中相同。ng-click過濾器比較兩個JSON數組

現在我拉動它返回一個對象,看起來像這樣的事件API -

事件API -

[{ 
"instructor_id": 502, 
"datetime": "2014-12-07T00:30:00.000Z", 
"end_time": "2014-12-07T01:00:00.000Z" 
}, { 
"instructor_url": 510, 
"datetime": "2015-01-20T16:00:00.000Z", 
"end_time": "2015-01-20T16:45:00.000Z" 
}] 

而且我也有一個單獨的API,在拉

最喜歡的教練的API

[{ 
"user_id": 510 
}, { 
"user_id": 506 
}] 

我可以過濾工作,如果在instructor_id我只是硬編碼到過濾器像這樣 -

<input type="radio" ng-click="instructor_url = {instructor_url: '510}"/> 

,然後運行我的NG-重複列表上的過濾器

<li ng-repeat="event in events | filter:instructor_url"> 

但顯然這不是我要找的。我希望能夠調用匹配它們的函數,並僅返回Event API中的instuctor_id與Favorite Instructor API中的user_is匹配的事件。

任何幫助,將不勝感激。

回答

1

請參閱下面的演示

var app = angular.module('app', []); 
 

 
app.controller('firstCtrl', function($scope) { 
 

 
    $scope.events = [{ 
 
    "instructor_url": 506, 
 
    "datetime": "2014-12-07T00:30:00.000Z", 
 
    "end_time": "2014-12-07T01:00:00.000Z" 
 
    }, { 
 
    "instructor_url": 510, 
 
    "datetime": "2015-01-20T16:00:00.000Z", 
 
    "end_time": "2015-01-20T16:45:00.000Z" 
 
    }]; 
 

 

 
    $scope.FavoriteInstructor = [{ 
 
    "user_id": 510 
 
    }, { 
 
    "user_id": 506 
 
    }]; 
 

 

 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app"> 
 
    <div ng-controller="firstCtrl"> 
 

 

 
    <label ng-repeat="user in FavoriteInstructor" ng-init="i= $parent">{{user.user_id}} 
 
     <input type="radio" name="instructor" ng-model="i.instructor_url" ng-value="user.user_id" /> 
 
    </label> 
 
    <label>all <input type="radio" name="instructor" ng-model="instructor_url" ng-value="" /></label> 
 
    <hr/> 
 
    <p>Events</p> 
 
    <hr/> 
 
    <li ng-repeat="event in events | filter:instructor_url"> 
 
     <h3>Instructor Url:{{event.instructor_url}}</h3> 
 
     <p>{{event.datetime | date:short}}-{{event.end_time | date :short}}</p> 
 
    </li> 
 
    </div> 
 
</body>

+0

謝謝@sylwester 如果我只想有一個過濾列表中的所有收藏教官一個單選按鈕? – Drewbietron 2014-12-11 16:52:31