Question

所以我有一个foreach循环，显示包含发送日期/计算短消息/计算短消息/状态的消息列表。我尝试将短消息绑定为HTML数据绑定，但这导致它的问题引入了新的换行符，因为消息来自HTML编辑器。所以我想也许有一种方法可以使用文本数据绑定，只需从中删除HTML标记。

任何人都知道这样做的方法吗？

HTML：

 <table class="table table-hover table-striped table-bordered text-center">
                            <thead>
                                <tr class="bg-success">
                                    <th width="15%" class="table-title" data-bind="click: sortMessageType" style="cursor: pointer">Message Type </th>
                                    <th width="25%" class="table-title" data-bind="click: sortSubject" style="cursor: pointer">Subject </th>
                                    <th width="40%" class="table-title" data-bind="click: sortMessage" style="cursor: pointer">Message </th>
                                    <th width="20%" class="table-title" data-bind="click: function(data, event) { sortDateCreated( $data, event ) }" style="cursor: pointer">Date Created </th>

                                </tr>
                            </thead>
                            <tbody data-bind="foreach: VisibleTemplates">
                                <tr>
                                    <td class="mailbox-subject" data-bind="click: function(data, event) { $parent.selectTemplate( $data, event ) }, text: $data.MessageType"></td>
                                    <td class="mailbox-subject" data-bind="click: function(data, event) { $parent.selectTemplate( $data, event ) }, text: $data.ShortSubject"></td>
                                    <td class="mailbox-subject" data-bind="click: function(data, event) { $parent.selectTemplate( $data, event ) }, text: $data.ShortMessage"></td>
                                    <td class="mailbox-subject" data-bind="click: function(data, event) { $parent.selectTemplate( $data, event ) }, text: $data.DateTime"></td>
                                </tr>
                            </tbody>
                        </table>

淘汰赛：

 self.ShortSubject = ko.computed(function () {
        if (self.Subject().length < 20) {
            return self.Subject();
        }
        else {
            return self.Subject().substring(0, 20) + '...';
        }
    });

    self.ShortMessage = ko.computed(function () {
        if (self.Message().length < 50) {
            return self.Message();
        }
        else {
            return self.Message().substring(0, 50) + '...';
        }
    });

Answer 1

您真正的问题是从输入文本中删除HTML。在淘汰赛中，您可以使用computed observables或custom bindings来处理该条目，并在显示之前移除这些代码。

删除标签的问题可以通过多种方式解决。例如，您可以使用此解决方案：Strip HTML from Text JavaScript（例如将您的文字放在隐藏或分离的div中），即explained in a different way here。

如何从Knockout Text绑定中删除HTML标记？

1 个答案: