angulaire.js - problème d'angularjs utilisant des fonctions dans la directive
巴扎黑
巴扎黑 2017-05-15 16:50:57
0
1
516

J'ai moi-même rédigé une directive, comme suit :

html

<myDirective source="listOne()"</myDirective>
<myDirective source="listTwo()"</myDirective>

contrôleur

...
$scope.listOne = function(){
    //返回一个promise
};
$scope.listTwo = function(){
    //返回另一个promise
};
...

directive

angular.module('myApp')
    .directive('myDirective', function() {
        function DataList(sourceFn) {
            var debounceId;
            self.list = [];
            self.load = function(){
                $timeout.cancel(debounceId);
                debounceId = $timeout(function() {
                    var promise = sourceFn();
                    promise.then(function(data) {
                        self.list = data;
                    });
                },0,false);
            };
            return self;
        }

        return {
            restrict: 'E',
            replace: true,
            scope: {
                source: '&'
            },
            link: function(scope, element, attr) {
                ...
                var data = new DataList(scope.source);
                ...
                scope.dataset = data.list;
                ...
            },
            template: '\
            ...\
            <li ng-repeat="d in dataset">{{d}}</li>\
            ...\'
        };
    }

Ensuite, le problème survient. On s'attend à ce que les deux sources renvoient deux ensembles de données différents, mais la situation réelle est que les données affichées dans les deux listes sont les mêmes, et ce sont les données renvoyées par la deuxième fonction. listTwo(), c'est-à-dire si j'échange les positions de listOne() et listTwo(), et que les données renvoyées sont les données de listOne().
Serait-ce

var data = new DataList(scope.source);
...
scope.dataset = data.list;

Lors de la deuxième utilisation de new, avez-vous remplacé les données de la première fois ?
Mais scope:{source: '&'} ne génère-t-il pas sa propre portée pour la directive ?
Je veux bien apprendre la directive, merci d'avance

巴扎黑
巴扎黑

répondre à tous(1)
Ty80

C'est un problème avec votre DataList. Ce que vous retournez est une auto-référence, qui semble être une fenêtre, donc la liste correspondante est une variable globale, donc peu importe le nombre de fois que vous attribuez une valeur, seule la dernière prend effet.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal