J'essaie de faire une demande http dans mon contrôleur, mais mon $scope.dataSource revient en tant que undefined, et je ne sais pas pourquoi. Je construis la directive comme ceci:

app.directive('users', function(){
    return {
        restrict: 'E',
        templateUrl: '/templates/dashboard/config/users.html',
        scope: {
            dataSource: '@'
        },
        controller: function($scope, $http){
            $http({
                url: $scope.dataSource
            }).success(function(data){
                $scope.data = data;
            });
        }
    };
});

Et le html comme celui-ci, mais il n'exécute pas la demande ajax car le $scope.dataSource est undefined.

<users class="col-sm-4" data-source="/data/users.json"></users>
0
Get Off My Lawn 21 juil. 2015 à 19:24

3 réponses

Meilleure réponse

Déplacez-le vers une fonction de montre:

app.directive('users', function($http) {
    return {
        restrict: 'E',
        templateUrl: '/templates/dashboard/config/users.html',
        scope: {
            source: '@'
        },
        link: function($scope){
            $scope.watch('source', function(source) {
              if (dataSource !== undefined) {
                $http({
                    url: source
                }).success(function(data){
                    $scope.data = data;
                });
              }
            });
        }
    };
});
0
jantimon 21 juil. 2015 à 16:51

L'utilisation de $attrs me permet d'obtenir la valeur comme ceci:

app.directive('users', function(){
    return {
        restrict: 'E',
        templateUrl: '/templates/dashboard/config/users.html',
        scope: {
            dataSource: '@'
        },
        controller: function($scope, $http, $attrs){
            $http({
                url: $attrs.source
            }).success(function(data){
                $scope.data = data;
            });
        }
    };
});

J'utilise toujours dataSource dans la portée et le html, mais j'utilise $attrs.source dans le contrôleur.

0
Get Off My Lawn 21 juil. 2015 à 16:49

Vous n'avez pas besoin d'une controller, vous avez besoin d'une fonction link et passez-lui les scope et $http.

app.directive('users', function($http){
    return {
        restrict: 'E',
        templateUrl: '/templates/dashboard/config/users.html',
        scope: {
            dataSource: '@'
        },
        transclude: true,
        link: function(scope, elem, attrs){
            $http({
                url: scope.dataSource
            }).success(function(data) {
                $parent.$scope.data = data; // where data is a model in parent controller.
            });
        }
    };
});
0
dnavas77 21 juil. 2015 à 16:47