如何将一个html字符串传递给我的子组件？

问题描述：

我需要将一个html字符串传递给角度为4的组件，但是我找不到一种方法将传递的字符串标记为安全。如何将一个html字符串传递给我的子组件？

我创建在父组件传递的HTML，它不是我从用户那里获取或从服务器中检索，这也是动态

我的代码看起来像这样（视情况而定/警报类型创建的）：

<app-alert 
 
    message = "Please complete your <span class=u>Profile</span>" 
 
    alertType = "alert-info" 
 
    icon = "glyphicon glyphicon-info-sign" 
 
    closeBtn = "true"> 
 
</app-alert>

我搜索了很多，但我无法找到合适的，我能找到的最接近的是this question，但只能用“正常”的字符串交易s，而不是包含html的字符串

如何将html字符串传递给我的子组件？

如何使用'ng-content'？ https://scotch.io/tutorials/angular-2-transclusion-using-ng-content –

闻起来像一个糟糕的设计。为什么不能把你需要的所有信息都包装到对象中，将它传递给组件，然后把html作为子组件的一部分，填充它并从孩子中展示出来？ –

@HarryNinh：谢谢，我打算去看看，我很快就会回来 – TheDude

答

您可以将html字符串作为组件输入。那么在你的子组件的html内使用innerHTML指令（https://www.dev6.com/Angular-2-HTML-binding）

<span [innerHTML]="componentInput"></span>

使用[innerHTML]的一个问题是它只能用于浏览器而不能用于其他渲染引擎。 – Sean12

@ Sean12我相信OP和你做了类似的事情，并在他的父代中创建了字符串，然后通过Input指令将它传递给一个孩子。这个字符串是什么意思是不完整的？该字符串通过输入指令传递，然后用于innerHTML指令以在span标签内插入html +文本 – LLai

如何将一个html字符串传递给我的子组件？

相关推荐