L'accès de la portée des variables à partir d'un filtre en AngularJS

Je suis de passage date de la valeur de mon filtre personnalisé de cette façon:

angular.module('myapp').
  filter('filterReceiptsForDate', function () {
    return function (input, date) {
      var out = _.filter(input, function (item) {
        return moment(item.value.created).format('YYYY-MM-DD') == date;
      });
      return out;
    }
  });

Je voudrais injecter un couple de portée des variables, là aussi, à l'instar de ce que je peux faire dans les directives. Est-ce possible de le faire sans avoir à passer ces vars explicitement que les arguments de la fonction?

InformationsquelleAutor Sergei Basharov | 2013-07-11

121

Apparemment, vous pouvez.

Habituellement, vous devez passer portée des variables pour le filtre en tant que paramètre de la fonction:
```
function MyCtrl($scope){
  $scope.currentDate = new Date();
  $scope.dateFormat = 'short';
}
```
```
<span ng-controller="MyCtrl">{{currentDate | date:dateFormat}}</span> //--> 7/11/13 4:57 PM
```
Mais, pour passer le champ d'application actuel, vous auriez à passer this:
```
<span ng-controller="MyCtrl">{{currentDate | date:this}}</span>
```
et this sera une référence à portée actuelle:

Simplifiée:
```
app.controller('AppController',
    function($scope) {
      $scope.var1 = 'This is some text.';
      $scope.var2 = 'And this is appended with custom filter.';
    }
  );


app.filter('filterReceiptsForDate', function () {
  return function (input, scope) {
    return input + ' <strong>' + scope.var2 + '</strong>';
  };
});
```
```
<div ng-bind-html-unsafe="var1 | filterReceiptsForDate:this"></div>

```
PLUNKER

Avertissement:
1. Être prudent et d'utiliser uniquement le périmètre de lire les valeurs à l'intérieur du filtre, parce que sinon, il vous sera facile de trouver votre auto dans $digest boucle.
2. Filtres qui ont besoin d'un tel "lourd" de la dépendance (l'ensemble) ont tendance à être très difficile à tester.
- Merci pour la réponse complète. Je suppose que je ferais mieux de simplement transmettre ces variables explicitement le filtre.
- +1 pour les avertissements. De très bonnes idées.
- merci, très utile!
- Merci! Pour d'autres, cette lecture, vous n'avez pas à utiliser ng-bind-html-unsafe, sauf si vous êtes de passage à html. aussi, j'ai utilisé $scope au lieu de scope alors c'est le même à l'intérieur du filtre est fonction que je suis habitué à ce que partout ailleurs 🙂
- Si vous avez vraiment besoin de mettre à jour un champ variable, alors vous devez déplacer votre filtre dans le Controller. De cette façon, il n'a pas un "gros" dépendance et est plus facile à tester. Utilisez simplement $filter('filter')(array, expression, comparator, anyPropertyKey) dans le Controller
InformationsquelleAutor Stewie
5

J'ai trouvé que this références locales $scope. Ne sais pas si c'est sûr moyen d'y accéder.

InformationsquelleAutor pavel_karoukin

Vous devez vous connecter pour publier un commentaire.

Avertissement: