html - pre 标签中的 AngularJS 数据绑定(bind)

Question

我只是想写一段代码来展示数据绑定(bind)的特定实例是如何工作的，但它一直在 pre 标签内评估!即使使用 { 和 } 它仍然会评估。我笑着发布这个问题，因为它看起来很简单，但我无法在网上找到简单的答案。我真的不想为了排除这一段代码而创建多个 ng-apps。

代码如下所示(我使用的是棱镜):

预转义

<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