AngularJS $compile throws exception

Question

Why this throws an exception?

var item = {ID: 2, Name: "Andrej" };
var html = "<div>{{ID}} - {{Name}}</div>";
$compile(html)(item); // THIS THROWS EXCEPTION

Exception is (line 764)

TypeError: jqLite("<div>").append(element).html().match(/^(<[^>]+>)/) is null

@Andy Joslin, 1) can $interpolate take scope objects?. 2) If i use $interpolate on a template string with some object or scope object as context, will the template updates as i change that context? +1 for the distinction bw $compile and $interpolate. Sorry i could not use "@Andy Joslin" in answer section. SO is automatically removing it — Rajkamal Subramanian
– Rajkamal Subramanian, Commented Apr 24, 2013 at 3:11

Andrew Joslin · Accepted Answer · 2012-11-19 18:57:42Z

4

If you just want to substitute values using the angular interpolator with an object, use $interpolate.

$compile is made for creating angularized elements, and requires a scope.

var item = {ID: 2, Name: "Andrej" };
var html = "<div>{{ID}} - {{Name}}</div>";
console.log($interpolate(html)(item)); // --> <div>2 - Andrej</div>

answered Nov 19, 2012 at 18:57

Andrew Joslin

43k21 gold badges102 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1