角度复选框以过滤数据

时间:2019-04-08 06:41:02

标签: javascript angularjs checkbox angular-ngmodel angularjs-ng-change

我正在使用复选框显示FreeEvents。我将值作为filter:filterFreeEvent传递给过滤器。一切正常。

但是我想避免在过滤器中传递值,而是想使用复选框的change事件进行过滤。

类似

  <input type="checkbox" ng-model="showFreeEvent" ng-change($event)">

这是我的JsFiddle示例。

有人做过这样的事情吗?任何帮助或建议,将不胜感激。

预先感谢

2 个答案:

答案 0 :(得分:0)

您可以使用var app = new Vue({ el: '#app', data: { editMode: true } }) 处理复选框更改事件。然后,您可以使用ng-change来过滤事件。过滤后的事件应存储在单独的变量中。这是如何执行此操作的示例:

Array.prototype.filter

然后在您的控制器中:

<input ng-model="showFreeEvents" type="checkbox" ng-change="onShowFreeEventsChanged()" />

<div ng-controller="myCtrl">
  <div ng-repeat="event in filteredEvents">
    <span>{{event.eventName}}</span></br>
    <span>{{event.eventStartDateTime}}</span></br>
    <span>{{event.itemCreatedDateTime}}</span></br>
    </br></br>
  </div>
</div>

答案 1 :(得分:0)

您还可以像这样仅在更改事件中更改变量:

<input ng-model="changeValue" ng-change="showFreeEvent = showFreeEvent== false ? true : false" value="" type="checkbox" />

如果showFreeEvent为false,则ng-change会将其更改为true,反之亦然。

相关问题