Chrillewoodz
Chrillewoodz

Reputation: 28328

How to evaluate a template from a controller?

I've got this template:

<div class="container-fluid">
  <div class="row">
    <div class="col-xs-12" ng-repeat="product in ad.products">
      <a href="{{product.link}}">
        <h1>{{product.title}}</h1>
        <img src="{{product.src}}">
        <p>{{product.description}}</p>
        <h5>{{product.price}}</h5>
      </a>
    </div>
  </div>
</div>

From my controller I need to evaluate this template so that it checks how many products that have been selected and then it interpolates each product's values into the template. After that is done I also need to remove the ng-repeat so it doesn't fire an error in the external pages that will use this where angular is not present. However I'd figure that I'd just use a regex to look up the ng-repeat and everything in the expression and then remove it.

I've been looking at $interpolate and $compile but I can't figure out how to work with them from my controller so that it does what I want. This is because when I use these on my template and then console log the template value it's a function with a whole lot of nonsense in it.

So doing this:

ad.html = $compile(res.data, $scope);

Generates something like this:

function(b,c,d){rb(b,"scope");e&&e.needsNewScope&&(b=b.$parent.$new());d=d||{};var h=d.parentBoundTranscludeFn,k=d.transcludeControllers;d=d.futureParentElement;h&&h.$$boundTransclude&&(h=h.$$boundTr…

Can someone shed some light on how to achieve what I want?

Upvotes: 1

Views: 321

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

Your are using $compile function in wrong way, you should call $compile(html) function by passing $scope parameter like below.

var compiledDOM = $compile(res.data)($scope);//then do append this DOM to wherever you want
ad.html = compiledDOM.html(); //but this HTML would not make angular binding working.

Upvotes: 1

Related Questions