角向指令传递参数

Question

I m trying to pass some information through a view in a directive and it doesnt seem to work at all. In fact, even if I bind the scope, I have the string value writter :

Here's the directive

angular.module('app')
    .directive('anomalieTableau', function () {

        var controller = ['$scope', '$attrs', 'srv_traitementsSite', function ($scope, $attrs, srv_traitementsSite) {
            $scope.anomalies = [];

            var idSite = $attrs.idsite;
            alert(idSite);
            var idAgence = $attrs.idagence;
            var dateDebut = $attrs.datedebut;
            var dateFin = $attrs.datefin;

            var promise = undefined;
            if (idAgence && idSite) {
                promise = srv_traitementsSite.TraitementSiteAgenceAnomalie(idSite, idAgence, dateDebut, dateFin);
            }

            promise.then(function (response) {
                $scope.anomalies = response.data;
            }, function (response) {

            });
        }];

        return {
            restrict: 'EAC',
            templateUrl: 'tpl/directive/AnomalieTableauDirective.html',
            controller: controller,
            scope: {
                idsite: '=',
                idagence: '=',
                datedebut: '=',
                datefin: '='
            }
        };
    });

Here's the HTML call :

<div anomalie-tableau idsite="site._id" idagence="AgenceId" datedebut="dateDebutStats"
                     datefin="dateFinStats" class="col-md-12"></div>

And this is the alert result in the directive :

site._id

Instead of :

123456789

EDIT : Changing site._id by {{site._id}} in the attribute directive's call, it changes nothing and gives me this error :

Syntax Error: Token 'site._id' is unexpected, expecting [:] at column 3 of the expression [{{site._id}}] starting at [site._id}}].

What am I doing wrong ?

Answer 1

Attributes are always strings. So you will need to interpolate the value ( {{site._id}} ) and then possibly convert the string ( $attrs.idsite ) to your desired type.

In respect to your scope-settings: You then have to use $scope instead of $attrs (and dont need the interpolation) since angular will copy those values to your scope. If you use = it will be a two-way-binding and you dont need to interpolate the values in your directive-attribute.

If you for some reason need to use $attrs you can do the interpolation yourself. Remove the scope-settings, use idsite="{{...}}" and inject the $interpolation Service into your directive.

Then use $interpolate($attrs.idsite)($scope.$parent) to get the value (string).

http://plnkr.co/edit/zhBXyiz82EdmysLzeBNL?p=preview

(note that in my plnkr I used @ in the scope-settings. You can remove that or leave it. With the @ angular will execute the interpolation for you and store the value in the $scope object of your directive.)