AngularJS filtering

Question

Я пытаюсь написать приложение todo mvc в угловом, но я застрял в фильтрации. То, что я пытаюсь фильтровать, это todos, которые завершены/активны или показывают все. У меня есть переменная, которая называется isCompleted, которую я пытаюсь фильтровать. Странная вещь заключается в том, что она работает, когда я фильтрую, чтобы получить завершенную, но когда я пытаюсь показать Active, она показывает как активную, так и завершенную. Я пытаюсь установить data-ng-repeat = "todo in todos | filter: {isComplete: false}", но он все еще показывает все мои тодо. Любые идеи о том, что я делаю неправильно?

<section id="main" data-ng-cloak=""> 
<input type="checkbox" id="toggle-all" data-ng-model="toggleAll" data-ng-click="markAll(toggleAll)" /> 
<ul id="todo-list"> 
    <li data-ng-repeat="todo in todos | filter: selectFilter()" data-ng-class="{completed: todo.isCompleted}"> 
     <input type="checkbox" class="toggle" data-ng-model="todo.isCompleted" /> 
     <label>{{todo.title}}</label> 
     <button class="destroy" data-ng-click="removeTodo(todo)"></button> 
    </li> 
</ul> 

function TodosController($rootScope, $scope, $location) { 

$scope.location = $location; 
$scope.$watch('location.path()', function (path) { 
    $scope.selectFilter = function() { 
     if (path == '/active') { 
      return { isCompleted: false }; 
     } 
     else if (path == '/completed') { 
      return { isCompleted: true }; 
     } 
     else 
     { 
      return null; 
     } 

    }; 
}); 

if (!$rootScope.todos) { 
    $rootScope.todos = [{ title: "todo1", isCompleted: true }, { title: "todo3", isCompleted: true }, { title: "todo2", isCompleted: false }]; 
    //$rootScope.todos = [new Todo('Todo1', true), new Todo('Todo4', true), new Todo('Todo2', true), new Todo('Todo3', false)]; 
} 
... 

Answer 1

В <li> добавить

ng-show="toggleAll || todo.isCompleted" 

Это означает, что, когда toggleAll проверяется, то ярлык на isComplete и возвращает true для каждого элемента; если toggleAll не проверяется, то следует ли показывать, зависит от isComplete.

Demo on jsFiddle