嵌套AngularJS ng-bind

Question

我有一个错误模式，如果$http post返回某个状态，它会显示一条消息。现在，我需要能够向显示中添加错误代码。客户希望它与消息在同一行上，但样式不同(小字体)，所以我尝试这样做：

<p class="text-center" data-ng-bind-html="message">
   <span data-ng-if="errCode" class="small" data-ng-bind="' code ' + (errCode)"></span>
</p>

传入我的模板的数据如下所示：

{title: "Login Error", message: "Server Response Error", errCode: 106, button: "OK"}

他们想要的是这样的：

服务器响应错误代码106

由于“代码106”是一个较小的字体(对不起，我不知道如何在markdown中更改span样式)。但是使用上面的代码，跨度被外部段落标记中的message绑定所覆盖。如何使用嵌套的ng-bind元素？(不能在将这些值作为单个变量传递之前将它们连接起来。)

Answer 1

为此，您需要使用内联元素作为兄弟元素。ng-bind-html取代innerHTML

<p class="text-center">
   <span  data-ng-bind-html="message"></span>
   <span data-ng-if="errCode" class="small" data-ng-bind="' code ' + (errCode)"></span>
</p>

Answer 2

答案是不使用ng-bind作为变量。这是可行的：

<p class="text-center">{{message}}<span data-ng-if="errCode" class="small"> code {{errCode}}</span></p>