gpt4 book ai didi

javascript - 解析元素标题中的html元素

转载 作者:行者123 更新时间:2023-11-30 06:12:49 24 4
gpt4 key购买 nike

我有一个文本区域元素

<textarea ng-model="text"></textarea>

我有另一个元素图标,它在悬停时显示来自 textarea 元素的文本

<i class="k-icon k-i-paste-plain-text" title="{{text}}">

一切正常;直到用户在文本框中键入 html,例如:如果文本是“<b>some random text </b>”,那么在标题中也会显示

<b>some random text </b>

我想知道如何解析它并仅附加标题中的文本。

最佳答案

Angular 在显示文本之前自动对文本中的 html 进行编码。这是因为您确实必须信任文本的来源,因为允许将脚本标记注入(inject)页面可以完全控制您的整个站点,包括访问身份验证 token 。对您在这里尝试做的事情要非常非常小心。

您可以创建一个允许显示 html 的过滤器

app.filter('unsafe', function($sce) {
return function(val) {
return $sce.trustAsHtml(val);
};
});

并与它一起使用

<i class="k-icon k-i-paste-plain-text" title="{{text | unsafe}}">

let app = angular.module('app', [])
.filter('unsafe', function($sce) {
return function(val) {
return $sce.trustAsHtml(val);
};
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app">
<textarea ng-model="text"></textarea>
<div ng-bind-html="text | unsafe"></div>
</div>

似乎您需要使用 ng-bind-html 进行绑定(bind),但不确定是否可以使用 title 属性。

关于javascript - 解析元素标题中的html元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57899427/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com