Question

我只是想写出一段代码，显示数据绑定的特定实例是如何工作的，但它会在pre标记中不断出现！即使使用{和}它仍然可以评估。我笑着发布这个问题，因为它似乎很简单，但我无法在网上找到一个简单的答案。我真的不想创建多个ng-app只是为了排除这一段代码。

代码看起来像这样（我正在使用棱镜）：

预转义

<input type="text" placeholder="Enter a hex color" ng-model="myColor">
<p style="color: #{{myColor}};">I am color #{{myColor}}</p>

发表转义

<pre><code class="language-markup">
    &lt;input type=&quot;text&quot; placeholder=&quot;Enter a hex color&quot; ng-model=&quot;myColor&quot;&gt;<br/>
    &lt;p style=&quot;color: #{{myColor}};&quot;&gt;I am color #&#123;&#123;myColor&#125;&#125;&lt;/p&gt;
</code></pre>

{{myColor}}也不起作用。我根本不想要那个东西来评估。

Answer 1

这里你去：

<code ng-non-bindable>{{myColor}}</code>

来自here

Answer 2

试试这种方式

ng-bind-html-unsafe="myColor"

示例演示：http://jsfiddle.net/afSsf/1/

预标签内的AngularJS数据绑定

2 个答案: