在使用 ng-bind-html 时，我应该如何使 html 元素出现在每个元素旁边？

Question

我有一个要求，我应该将 HTML 个元素并排显示，我正在使用 angularjs，当我在 HTML 标记中使用 ng-bind-html 时，它的下一个元素总是出现在新行中。我想让元素彼此相邻出现。谁能帮我解决这个问题？我创建了一个样本 plunk https://plnkr.co/edit/Bq3x4hw5L1MNkLoJW8LQ?p=preview

我期待结果

I am an HTMLstring with links! and other stuff Sai

但它总是在生产

I am an HTMLstring with links! and other stuff

Sai

Answer 1

这是一个CSS问题，修改代码如下

<div style="display:flex;">
  <p ng-bind-html="myHTML" style="margin: 0;"></p> <span>Sai</span>
</div>

Answer 2

P 元素基本上是块元素和 span 内联元素，所以当你将 span 放在 p 之外时，它总是从新行开始。只需将您的 html 绑定到一个内联元素，两者将在同一行。

<p><span ng-bind-html="myHTML"></span> <span> Sai</span></p>

在使用 ng-bind-html 时，我应该如何使 html 元素出现在每个元素旁边？

How should I make the html elements appear next to each while using ng-bind-html?

html

css

angularjs

angularjs-directive