Question

是否可以在Angular表达式中插入HTML元素？我们举一些例子。

我想做这样的事情：

<table>
    <tr ng-repeat="employee in employees">
        <td>{{employee.firstname ? employee.firstname : '<p style="color:red">No name</p>'}}</td>
        <td>{{employee.job}}</td>
    </tr>
</table>

在我们的控制器中，我们有：

$scope.employees = [{firstname:'Bob', job:'Developer'},
                    {firstname:'Paul', job:'Manager'},
                    {job:'Developer'}]

我们向所有员工（姓名/职位）展示，当我们没有该人的姓名时，我们会显示No name。

谢谢：）

Answer 1

您可以使用ng-show，如果employee.firstname为null，它将显示段落。

<tr ng-repeat="employee in employees">
    <td>{{employee.firstname }}<p ng-show="!employee.firstname" style="color:red">No name</p></td>
    <td>{{employee.job}}</td>
</tr>

Answer 2

在这种情况下，你可以简单地使用ng-if

<tr ng-repeat="employee in employees">
    <td ng-if="employee.firstname">{{employee.firstname}}</td>
    <td ng-if="!employee.firstname"><p style="color:red">No name</p></td>
    <td>{{employee.job}}</td>
</tr>

Answer 3

在这种情况下，您可以使用ng-bind

<tr ng-repeat="employee in employees" ng-bind="functionName(argument);"></tr>

在控制器中，您可以将逻辑放在functionName()函数中。

$scope.functionName(){
  //Your logic goes here
}

根据您的情况，返回相关的html

Angular绑定表达式中的HTML元素

3 个答案: