angularjs搜索和多个复选框过滤器无效

时间:2016-08-24 07:29:18

标签: angularjs html5 angular-filters

这是我的代码。我必须使用角度js应用一个文本框搜索过滤器和3个复选框过滤器,但它无法正常工作。



var app = angular.module('searchApp', []);
app.controller('myCtrl', function($scope) {
    $scope.publishList = [
        {id:"1",scheduleName:"Forrest Gump"},
        {id:"2",scheduleName:"test name"},
        {id:"3",scheduleName:"rapid fast"},
        {id:"4",scheduleName:"awesome"},
    ];
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<input type="text" ng-model="searchScheduleTitle" class="search-input" id="search-input" aria-describedby="search" placeholder="Search a schedule by name"><br/>
<input type="checkbox" ng-model="status" class="checkbox" ng-true-value='Not Yet Started' ng-false-value='' />Not Yet Started <br/>
<input type="checkbox" ng-model="status" class="checkbox" ng-true-value='In-Progress' ng-false-value='' />In-Progress <br/>
<input type="checkbox" ng-model="status" class="checkbox" ng-true-value='Published' ng-false-value='' />Published <br/>
<div ng-app="searchApp" ng-controller="myCtrl">
  
<div ng-repeat="schedules in publishList | filter:searchScheduleTitle | filter:status" class="schedulelist"><div class="col-md-12 box-cnt" id="schedule-{{schedules.id}}" ng-click="getSheduleDetails($event,$index)" ng-class="{selectedschedule: $index == selected}">
        <div class="row">
            <div class="col-md-7">
                <p><b>{{schedules.scheduleName}}</b></p>
                <p>Release Date - {{schedules.releaseDate | date:'MM/dd/yyyy'}}</p>
                <p>Publishing Date - {{schedules.releaseDate | date:'MM/dd/yyyy'}}</p>
            </div>
            <div class="col-md-5 text-right">
                <button type="button" ng-class="{'btn-green': schedules.status == 'Published', 'btn-orange': schedules.status == 'In-Progress', 'btn-red': schedules.status == 'Not Yet Started'}" class="status_btn btn">{{schedules.status | uppercase}}</button>
            </div>
        </div>
    </div>
</div>
  </div>
&#13;
&#13;
&#13;

0 个答案:

没有答案