0

Кто-нибудь может объяснить, почему при нажатии на checkbox срабатывает фильтр? Какое имеет отношение в данном сличение checkbox к фильтру?

 angular.module('App.filters', []).filter('dummyFF', [
   function() {
     return function(input, a) {
       console.log(input, a);
       return input;

     };
   }
 ]);


 var app = angular.module('plunker', ['App.filters']);

 app.controller('MainCtrl', function($scope) {
   $scope.name = 'World';


   $scope.cars = [{
     model: '316',
     make: 'Bmw'
   }, {
     model: '520',
     make: 'Bmw'
   }, {
     model: 'Fiesta',
     make: 'Ford'
   }, {
     model: 'Focus',
     make: 'Ford'
   }, {
     model: 'Clio',
     make: 'Renault'
   }, {
     model: 'Toledo',
     make: 'Seat'
   }, {
     model: 'Leon',
     make: 'Seat'
   }, {
     model: 'Insignia',
     make: 'Opel'
   }, {
     model: 'Astra',
     make: 'Opel'
   }, {
     model: 'Corsa',
     make: 'Opel'
   }];

 });
<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.25/angular.js" data-semver="1.2.25"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>

  <div ng-repeat="car in cars | dummyFF:{s:car.make}">{{car.make}}</div>

  <input type="checkbox" ng-model="useMakesgg[$index]" ng-checked="true" />


</body>

</html>

1 ответ 1

1

Возможно, я ошибаюсь, знающие люди меня поправят.

Суть в том, что на чекбоксе у тебя висит ng-model, значит оно привязано к $scope.

Ангуляр для всех таких полей (а также данных в скобках {{}} ) добавляет свой watch, для того чтобы следить за изменениями. Ангуляру для того, чтобы понять, где именно поменялись данные, нужно вызвать $scope.$digest(), который в цикле опрашивает все вотчи. Это и заставляет вызваться ваш фильтр.

Примерно так устроен знаменитый two way data binding.

Вообще советую почитать толковую статью на эту тему.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.