CODEWITHSUNDEEP
angularjsangularjs-directive
Misha Moroshko
Misha Moroshko

Reputation: 171341

How to write AngularJS directive that generates another directive?

I use the alert directive like this:

<alert ng-repeat="alert in alerts" type="'danger'">{{alert}}</alert>

where alerts is something like: ['Hello', 'World'].

I would like to create an alerts directive which will be used like this:

<alerts model="alerts"></alerts>

which will be equivalent to the above.

I tried to start with: (live demo)

app.directive('alerts', function() {
  return {
    restrict: 'E',
    scope: {
      model: '='
    },
    template: '<alert ng-repeat="alert in {{model}}" type="\'danger\'"></alert>'
  };
});

but I get the following error:

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

Why is that?

What would be the right way to implement the alerts directive?

Upvotes: 1

Views: 353

Answers (1)

Chandermani
Chandermani

Reputation: 42669

Remove {{ and }} from the ng-repeat binding in the template. It would work. You do not need to use {{ }} inside an expression.

Upvotes: 4

Related Questions