angular:根据模型中的布尔值切换按钮文本

时间:2014-01-29 19:06:23

标签: javascript angularjs

根据布尔值更改按钮元素中文本的简单方法是什么?

伪代码:

<button> some text OR some other text </button>

我读到了这个:Angularjs if-then-else construction in expression

这与ng-switch相关:http://docs.angularjs.org/api/ng.directive:ngSwitch

似乎无法使用模型中的bool值

6 个答案:

答案 0 :(得分:74)

应该这样使用:

<button> {{ cond_vall == true ? 'Case 1' : 'Case 2' }}</button>

答案 1 :(得分:14)

我想这取决于你要展示的文字是什么。如果您可以控制文本在控制器中的内容,则可以将文本绑定到范围变量并将其设置在控制器中,这样您就不必在视图中放置任何逻辑。类似的东西:

<button>{{someScopeVarWithYourString}}</button>

否则,您可以在布尔条件上使用ng-if或ng-show。

<button ng-show="someBoolValue">some text</button>
<button ng-show="!someBoolValue">some other text</button>

答案 2 :(得分:9)

因为我需要为按钮文本使用过滤器(翻译过滤器),所以以下解决方案最适合我:

<button>
    <span> {{ condition ? 'some_text' : 'some_Other_text' | translate }}"</span>
</button>

答案 3 :(得分:2)

没有足够的代表来编辑或评论,添加到@Tonio的回答(这对我不起作用) 如果您想要翻译,这是正确的:

data[] <- lapply(data, function(x) as.numeric(as.character(x)))

答案 4 :(得分:0)

{{1}}

答案 5 :(得分:0)

Angular 8 LTSTypescript 3.5ngx-bootstrap组合在一起时仅需要括号即可

<button type="button" class="btn"> {{ ( boolVar ? 'text' : 'other text')  | translate }} </button>