CODEWITHSUNDEEP
angularjs
matsko
matsko

Reputation: 22183

Setting bindings for a directive that has a templateURL in AngularJS

I'm not having any luck setting the bindings within a directive that fetches a template from a templateUrl.

Here's what the inside of my binding code looks like:

templateUrl : '/path/to/template.html',
link : function($scope, element, attrs) {
  $scope.title = 'test';
}

And here's what the template itself looks like:

<div>
  <h4>{{title}}</h4>
</div>

The directive is fired for a data-video attribute. The directive itself gets fired and downloads the template, but the scope bindings are not replaced.

Any ideas on how to do this?

Upvotes: 1

Views: 7191

Answers (1)

Gloopy
Gloopy

Reputation: 37785

What you have looks good to me here are some suggestions:

  • If {{title} isn't a typo make sure you use {{title}} instead.
  • The demo at the bottom of the directive documentation shows something similar in case that helps.
  • Make sure your template isn't being cached and causing confusion by making some noticeable changes and making sure you see it on refresh.
  • If you have replace: true set make sure your html file doesn't have any comments outside the root level per this post.
  • The link function's scope doesn't need a $ but I don't think that will affect anything: function(scope, element, attrs)

Upvotes: 3

Related Questions