Question

我试图通过ng-click在单选按钮上创建一个角度过滤器，用于比较两个单独的JSON对象，如果ng-repeat列表中的值相同，则返回该对象。

现在我正在引入一个事件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，它会列出用户最喜欢的教练列表，然后返回那个收藏的教练ID，就像这样

收藏的教师API

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

如果我只是在instructor_id中将代码硬编码到这样的过滤器中，我可以使过滤器正常工作 -

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

然后在我的ng-repeat列表上运行过滤器

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

但显然这不是我想要的。我希望能够调用匹配它们的函数，并仅返回事件API中的instuctor_id与Favorite Instructor API中的user_is匹配的事件。

任何帮助都将不胜感激。

Answer 1

请参阅下面的演示

＆＃13;

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
  }];



});

＆＃13;

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

＆＃13;

ng-click Filter比较两个JSON数组

1 个答案: