如何在单击时触发角自定义筛选器并填充已过滤的数据？

Question

我希望只在单击.prerequisites链接(可以成为按钮)时才显示和填充.popPrereq容器。

json数据已经在主控制器中可用，过滤器可以正常工作。我只需要一种方法，告诉角，以填充数据点击。

<a href="#" data-ng-show="course.CoursePrerequisites" class="popPrereq">Prerequisites</a>

<div class="prerequisites" style="background:pink">

    <div class="prerequisite" data-ng-repeat="prerequisite in courses | getPrerequisites:course.CoursePrerequisites">
        <p>{ {prerequisite.ProgramCode} } <br> <b>{ {prerequisite.pagetitle} }</b></p>
    </div>

</div>

这是我的自定义过滤器

coursesSearchApp.filter('getPrerequisites', function(){
    return function(prerequisites, ids){

        var searchIds = ids.split(',');
        var arrayToReturn = [];

        for (var i=0; i<prerequisites.length; i++){
            if (searchIds.indexOf(prerequisites[i].id) != -1) {
                arrayToReturn.push(prerequisites[i]);
            }
        }

        return arrayToReturn;
    };
});

谢谢

Answer 1

添加到popPrereq超链接ngClick指令，其中将先决条件容器的显示/隐藏状态设置为true。并将带有此标志值的ngIf指令添加到先决条件中。

<a href="#" data-ng-show="course.CoursePrerequisites" 
  data-ng-click="showPrerequisites = true"
  class="popPrereq">Prerequisites</a>

<div data-ng-if="showPrerequisites" class="prerequisites" style="background:pink">

  <div class="prerequisite" data-ng-repeat="prerequisite in courses | getPrerequisites:course.CoursePrerequisites">
    <p>{ {prerequisite.ProgramCode} }
      <br> <b>{ {prerequisite.pagetitle} }</b>
    </p>
  </div>

</div>