ng-bind-html 不能正常工作 [英] ng-bind-html doesn't work properly

问题描述

我想在 angularjs 中将我的数据显示为 html.这是我的代码的一部分:

<div id="divHosgeldiniz" name="hosgeldinizMessages" ng-repeat="hosgeldinizMessages 中的 hosgeldinizMessage"><div><span ng-class-odd="'degisimIcerik'" ng-class-even="'degisimIcerik alterik'" ng-bind-html="hosgeldinizMessage.M_Icerik">{{hosgeldinizMessage.M_Icerik}} </span>

但它不显示为 html 它就像普通文本一样显示但是 hosgeldinizMessage.M_Icerik 包含 html 元素.我应该怎么做才能显示为 html?

解决方案

获取 ngSanitize 作为模块中的依赖项

 var app = angular.module("dene",['ngSanitize']);app.controller("deneCtrl",function(){this.selam = "<p>Merhaba <strong>Angular</strong></p>";});

并在您的视图中使用 ng-bind-html

<span ng-bind-html = " dene.selam "></span>

但一定要包含相关版本

如

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-sanitize.min.js"></script>

或者如果您更喜欢在本地下载副本https://code.angularjs.org/

注意事项

<块引用>

确保您拥有与 AngularJS 版本相同的 ngSanitize 版本你正在跑步，

好吧......出于某种原因如果你把它们混在一起(例如 angular 1.2.23 和 angular-sanitize 1.0.0)你最终会得到一个消毒版本在你看来(它会工作)但控制台中有很多错误，或者有时它不会完全在屏幕上呈现 :) - 我相信这就是你所面临的

相信我，我去过那里 :D

I want to show my data as html in angularjs. Here is apart of my codes :

<div class="panel-body" ng-controller="hosgeldinizController">
    <div id="divHosgeldiniz" name="hosgeldinizMessages" ng-repeat="hosgeldinizMessage in hosgeldinizMessages">

        <div>
            <span ng-class-odd="'degisimIcerik'" ng-class-even="'degisimIcerik alternate'" ng-bind-html="hosgeldinizMessage.M_Icerik">{{hosgeldinizMessage.M_Icerik}} </span>
        </div>            
    </div>
</div>

But it doesnt show as html it shows just like normal text however hosgeldinizMessage.M_Icerik contains html elements. What should I do to show as html?

解决方案

Get ngSanitize as a dependancy in your module

    var app = angular.module("dene",['ngSanitize']);
    app.controller("deneCtrl",function(){
       this.selam = "<p>Merhaba <strong>Angular</strong></p>";
    });

and use ng-bind-html in your view

<div ng-controller="deneCtrl as dene">
<span ng-bind-html = " dene.selam "> </span>
</div>

but be sure to include the related versions

as in

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-sanitize.min.js"></script>

or if you prefer it locally you download a copy https://code.angularjs.org/

point to note

Make sure that you have the same version of ngSanitize as AngularJS version you are running ,

well .... for some reason if you mixed them up (e.g angular 1.2.23 and angular-sanitize 1.0.0) you will end up with either a sanitized version in your view (it will work) but ALOT of ERRORS in your console or sometimes it wont render on screen at ALL :) - I believe that's what you are facing

Trust me , I 've been there :D

这篇关于ng-bind-html 不能正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！