使用Angular表达式有条件地将字符串添加到HTML

Question

我有以下内容：

<div>{{animalType}}</div>

评估为dog。

我是否可以有条件地添加s如果animalType评估除了狗以外的其他任何内容？

像这样：不起作用

<div>{{animalType}} {{'s' : !animalType == 'dog'}}</div> 

所以我会得到cats

Answer 1

在表达式中使用<div>{{animalType}}{{animalType != 'dog' ? 's' : '' }}</div> 运算符，如下所示：

{{1}}

Answer 2

可选地

<div>{{animalType}}<span ng-show="animalType!='dog'">s</span></div> 

Answer 3

未经测试，但请尝试使用以下简单代码：

<div>{{animalType === "dog" ? animalType : "s"}}</div> 

顺便说一下，如果你只想在两个值之间切换，从我的观点来看，逻辑上很吸引人的是：

<div>{{isDog ? "dog" : "s"}}</div>

$scope.isDog = true/false

Answer 4

You could also use ng-if

<div>{{animalType}}<div ng-if="animalType !== 'dog'">s</div></div>