选择列表中的HTML实体Knockout

Question

所以我有一个与某些数据绑定的选择列表：

<select>
    <option selected="selected">-- Please select your company --</option>
    <!-- ko foreach: dealerList -->
        <optgroup data-bind="attr: {label: name}, foreach: dealers">
            <option data-bind="text: name, option: $data"></option>
        </optgroup>
    <!-- /ko -->
</select>

但是，某些数据（由API提供）包含HTML实体。例如，提供给optgroup标签的数据。 &呈现为&

如何正确渲染这些？

Answer 1

我知道的唯一解决方法是使用the html binding（类似于text绑定，但它会按原样呈现html，包括实体），但是可以隐藏安全隐患< / em>以及大多数实际 html 在option元素内无效的事实。

这里有证据：

＆＃13;

＆＃13;

ko.applyBindings({
  dealerList: [
    {
      name: 'group 1',
      dealers: [
        { name: 'Mark & Sons' }
      ]
    }
  ]
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script>
<select>
    <option selected="selected">-- Please select your company --</option>
    <!-- ko foreach: dealerList -->
        <optgroup data-bind="attr: {label: name}, foreach: dealers">
            <option data-bind="html: name, option: $data"></option>
        </optgroup>
    <!-- /ko -->
</select>

＆＃13;

＆＃13;

＆＃13;

如果您不相信text和html之间的某些功能需要a custom binding handler的数据，那么这只会呈现实体而非其他内容。