Angular2 innerHtml删除样式

发布时间：2020-12-17 07:18:23 所属栏目：安全来源：网络整理

导读：我正在使用inner Html并在我的cms中设置html,响应似乎没问题,如果我这样打印：{{poi.content}} 它给了我正确的内容： ` table border="0" cellpadding="5" cellspacing="0" tbody tr td style="vertical-align: top;"Tes11t/td td style="width: 2px;"nbsp;/

我正在使用inner Html并在我的cms中设置html,响应似乎没问题,如果我这样打印：{{poi.content}}

它给了我正确的内容：
`

<table border="0" cellpadding="5" cellspacing="0">
   <tbody>
     <tr>
       <td style="vertical-align: top;">Tes11t</td>
       <td style="width: 2px;">&nbsp;</td>
       <td style="width: 1px;"><img alt="midgetgolf-sport-faciliteiten-vakantiepark-2.jpg" src="http://beeksebergen.dev/app_dev.php/media/cache/resolve/full_size/midgetgolf-sport-faciliteiten-vakantiepark-2.jpg" style="height: 67px; width: 100px;" /></td>
      </tr>
    </tbody>
 </table>

但是当我使用[innerHtml] =“poi.content”时,它会给我这个html：

<table border="0" cellpadding="5" cellspacing="0">
    <tbody>
        <tr>
            <td>Tes11t</td>
            <td>&nbsp;</td>
            <td><img alt="midgetgolf-sport-faciliteiten-vakantiepark-2.jpg" src="http://beeksebergen.dev/app_dev.php/media/cache/resolve/full_size/midgetgolf-sport-faciliteiten-vakantiepark-2.jpg"></td>
        </tr>
    </tbody>
</table>

当我使用[innerHtml]时,有谁知道为什么它会剥离我的样式

Angular2清理动态添加的HTML,样式,……

@Pipe({name: 'safeHtml'})
export class Safe {
  constructor(private sanitizer:DomSanitizer){}

  transform(html) {
    return this.sanitizer.bypassSecurityTrustHtml(html);
  }
}

[innerHtml]="poi.content | safeHtml"

看到

> https://angular.io/docs/ts/latest/api/platform-browser/index/DomSanitizer-class.html
> In RC.1 some styles can’t be added using binding syntax更多细节.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!