web-dev-qa-db-fra.com

Libérer $ watch dans angularjs après appelé

Je sais que vous pouvez dissocier une montre $ comme ceci:

var listener = $scope.$watch("tag", function () {});
// ...
listener(); // would clear the watch

mais pouvez-vous dissocier la montre dans la déclaration de fonction de la montre. Donc, après que la montre soit exécutée une fois, elle se dissocie? Quelque chose comme:

$scope.$watch("tag", function () {
    unbindme()
});
javascriptangularjsframeworks
28
Michael

vous pouvez simplement le faire comme vous le faites déjà, appelez le "désenregistrement" dans votre fonction:

var unbind = $scope.$watch("tag", function () {
    // ...
    unbind();
});
57
Kris Ivanov

Comme tag est une expression, vous pouvez utiliser une liaison unique pour dissocier une fois la valeur reçue:

$scope.$watch("::tag", function () {});


angular
.module('app', [])
.controller('example', function($scope, $interval) {
  $scope.tag = undefined
  $scope.$watch('::tag', function(tag) {
    $scope.tagAsSeen = tag
  })
  $interval(function() {
    $scope.tag = angular.isDefined($scope.tag) ? $scope.tag + 1 : 1
  }, 1000)
})
angular.bootstrap(document, ['app'])
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body ng-controller="example">
Tag: {{tag}}
<br>
Watch once result: {{tagAsSeen}}
</body>
</html>

9
Klaster_1

directive bindonce peut-être ce dont vous avez besoin.

https://github.com/Pasvaz/bindonce

1
Wei Liu
var unbindMe=$scope.$watch('tag',function(newValue){
    if(newValue){
       unbindMe()
    }
})
0
Arun Redhu

Tout comme une question similaire , une légère amélioration de la réponse de @Kris vous apportera quelque chose de plus élégant et réutilisable tout au long du projet.

.run(function($rootScope) {
    $rootScope.see = function(v, func) {
        var unbind = this.$watch(v, function() {
            unbind();
            func.apply(this, arguments);
        });
    };
})

Maintenant, grâce à l'héritage prototypique de portée, vous pouvez simplement aller

$scope.see('tag', function() {
    //your code
});

Et ne vous inquiétez pas du tout.

0
Hashbrown