Html AngularJS JSON赢得'；t插入<；输入>；标签

我在将标签放入AngularJS web应用程序时遇到问题。它可以很好地从JSON文件加载数据。它还识别我的HTML标记，如

和

。我通过$sce trustAsHtml实现了这一点。但它不适用于

标记。我已经尝试了两天，但我找不到一个有效的解决方案。感谢您的帮助和解释

index.html

<div ng-bind-html="myName.name"></div> <!-- The Test from the data.json file shows up in italic but the input does not show up in the DOM -->

data.json

"name" : "<em>Test</em> <input type='text' name='Hello'>"

“名称”：“测试”

从您的示例中不清楚如何使用

trustAsHtml

过滤器

无论如何，似乎

$sce.trustAsHtml（）

正在完成任务：

（函数（角度）{
"严格使用",；
angular.module（'bindHtmlExample'，['ngSanitize']））
.controller（'ExampleController'，['$scope'，'$sce'，函数（$scope，$sce）{
$scope.myHTML=$sce.trustAsHtml(
“测试”）；
}]);
})（窗口角度）；
/*
版权所有2018谷歌公司。保留所有权利。
此源代码的使用受MIT风格的许可证管理，该许可证
可以在以下位置的许可证文件中找到：http://angular.io/license
*/

示例-示例ng绑定html产品

从您的示例中不清楚如何使用

trustAsHtml

过滤器

无论如何，似乎

$sce.trustAsHtml（）

正在完成任务：

（函数（角度）{
"严格使用",；
angular.module（'bindHtmlExample'，['ngSanitize']））
.controller（'ExampleController'，['$scope'，'$sce'，函数（$scope，$sce）{
$scope.myHTML=$sce.trustAsHtml(
“测试”）；
}]);
})（窗口角度）；
/*
版权所有2018谷歌公司。保留所有权利。
此源代码的使用受MIT风格的许可证管理，该许可证
可以在以下位置的许可证文件中找到：http://angular.io/license
*/

示例-示例ng绑定html产品

您已经定义了一个过滤器（

trustAsHtml

），您不将其应用于您的值。因此，

ng bind html

的内容不通过过滤器运行，实际上不可信

正如georgeawg在下面的评论中指出的，事实上，许多是通过

ng bind html

允许的，而不需要通过

$sce.trustAsHtml（）

运行，

就是这些标记之一

但是

不是

因此，您需要通过将标记更改为以下内容，通过

ng bind html

，应用过滤器以允许不安全的标记：

<div class="txt" ng-bind-html="myName.name | trustAsHtml"></div>

---

虽然我还没有在AngularJS环境中实际测试它，但它应该可以工作。要做到这一点，我首先需要知道您使用的是什么版本

看到它在这里工作：

（函数（）{
//声明应用程序
var app=angular.module（'testApp'，[]）；
app.controller（'testCtrl'，['$scope'，'$timeout'，函数（$scope，$timeout）{
$scope.waiting=true；
$timeout（（）=>{
$scope.waiting=false；
$scope.name=“测试”；
}, 1000);
}]).filter（'trustAsHtml'[
“$sce”，
功能（$sce）{
返回函数（值）{
返回$sce.trustAsHtml（值）；
}
}
]);
})();

让我们等一下。。。
您已经定义了一个过滤器（
trustAsHtml
），您不将其应用于您的值。因此，
ng bind html
的内容不通过过滤器运行，实际上不可信

正如georgeawg在下面的评论中指出的，事实上，许多是通过
ng bind html
允许的，而不需要通过
$sce.trustAsHtml（）
运行，
就是这些标记之一

但是
不是

因此，您需要通过将标记更改为以下内容，通过
ng bind html
，应用过滤器以允许不安全的标记：

<div class="txt" ng-bind-html="myName.name | trustAsHtml"></div>




虽然我还没有在AngularJS环境中实际测试它，但它应该可以工作。要做到这一点，我首先需要知道您使用的是什么版本

看到它在这里工作：


（函数（）{
//声明应用程序
var app=angular.module（'testApp'，[]）；
app.controller（'testCtrl'，['$scope'，'$timeout'，函数（$scope，$timeout）{
$scope.waiting=true；
$timeout（（）=>{
$scope.waiting=false；
$scope.name=“测试”；
}, 1000);
}]).filter（'trustAsHtml'[
“$sce”，
功能（$sce）{
返回函数（值）{
返回$sce.trustAsHtml（值）；
}
}
]);
})();

让我们等一下。。。
如果此副本无法回答您的问题，请告诉我。是否为完全相同的副本？你能链接到这个问题吗？这个：。你可以点击上面的文本。不，我已经讨论了这个解决方案，正如我在问题中所说的，我把我的数据、字符串和HTML称为fine，这是不起作用的输入。这不是那个问题的重复。对不起，伙计。我已重新提出这个问题。祝你好运<代码>：）
如果此副本不能回答您的问题，请告诉我。是否完全相同？你能链接到这个问题吗？这个：。你可以点击上面的文本。不，我已经讨论了这个解决方案，正如我在问题中所说的，我把我的数据、字符串和HTML称为fine，这是不起作用的输入。这不是那个问题的重复。对不起，伙计。我已重新提出这个问题。祝你好运<代码>：）

txt类没有添加斜体，它确实可以工作，因为我正在查看斜体文本，并且可以将其更改为使用
和其他标记。我曾尝试过实际的过滤器，但我在控制台中收到了以下错误消息：error“”angular.min.js:125要回答您的问题，我使用的是AngularJS v1.6.7如果文本为斜体，则不证明

通过

ng bind html

。它能做的唯一证明是，如果您检查源代码，并在live页面中看到

内的

标记。甚至