I've found a strange, weird behavior with the <pre>
tag in HTML when used in conjunction with angular.js' method of data binding via curly braces. Given the data binding foo = 'bar'
, I want to write
<pre>
{{{foo}}}
</pre>
such that it prints
{bar}
within the <pre>
environment.
It's no good to print { bar }
, with the spaces. (This is ultimately used to generate BibTeX.) I've tried using the html entities {
and }
, as well as the <xmp>
environment.
Any idea what's going on here? Thanks in advance.
You can try quoting the brackets:
{{ "{" + foo + "}" }}
Demo: http://plnkr.co/edit/4LG6jfAAzzcw4tQuoTSw?p=preview
You also might try making a function:
$scope.q = function(s) {
return "{" + s + "}";
}
{{ q(foo) }}