我应该在哪个HTML元素上放置ng-if？

Question

我正在尝试根据布尔值在所需字段旁边放置星号（*）。

如果我使用<p>标记执行此操作，Visual Studio会抱怨在<p>内放置<label>标记无效。

<label>Title: <p ng-if="titleRequired">*</p></label>

同样，如果我尝试使用<div>，我会得到类似的抱怨，即div不能放在标签内。

<label>Title: <div ng-if="titleRequired">*</div></label>

如果我将ng-if放在<label>上，我遇到了希望星号为红色但标签文字为标准黑色的问题。

<label ng-if="titleRequired">Title: *</label>

我可以尝试使用字体标记解决这个问题，但它已经过时了。

<label ng-if="titleRequired">Title: <font color="red">*</font></label>

所有这些都会在Chrome中呈现，但我想尽可能使用有效的标记。有没有办法用有效的标记来做到这一点？

Answer 1

您应该使用<span>代替<div>

<label>Title: <span ng-if="titleRequired">*</span></label>

然后你可以用一些CSS自定义你的元素。

<style>
    span { color: #FF0000; }
</style>