AngularJS:ng-show/ng-hide 不适用于 `{{ }}` 插值 [英] AngularJS: ng-show / ng-hide not working with `{{ }}` interpolation
问题描述
我正在尝试使用 AngularJS.
I am trying to show / hide some HTML using the ng-show
and ng-hide
functions provided by AngularJS.
根据文档,这些函数各自的用法如下:
According to the documentation, the respective usage for these functions are as follows:
ngHide – {expression} - 如果表达式为真,则分别显示或隐藏元素.ngShow – {expression} - 如果表达式为真,则分别显示或隐藏元素.
ngHide – {expression} - If the expression truthy then the element is shown or hidden respectively. ngShow – {expression} - If the expression is truthy then the element is shown or hidden respectively.
这适用于以下用例:
<p ng-hide="true">I'm hidden</p>
<p ng-show="true">I'm shown</p>
但是,如果我们使用来自对象的参数作为表达式,那么 ng-hide
和 ng-show
将被赋予正确的 true
>/false
值,但这些值不被视为布尔值,因此始终返回 false
:
However, should we use a parameter from an object as the expression then the ng-hide
and ng-show
are given the correct true
/false
value but the values are not treated as a boolean so always return false
:
来源
<p ng-hide="{{foo.bar}}">I could be shown, or I could be hidden</p>
<p ng-show="{{foo.bar}}">I could be shown, or I could be hidden</p>
结果
<p ng-hide="true">I should be hidden but I'm actually shown</p>
<p ng-show="true">I should be shown but I'm actually hidden</p>
这是一个错误,或者我没有正确执行此操作.
This is either a bug or I am not doing this correctly.
我找不到任何关于将对象参数作为表达式引用的相关信息,所以我希望任何对 AngularJS 有更好理解的人都可以帮助我?
I cannot find any relative information on referencing object parameters as expressions so I was hoping anyone with a better understanding of AngularJS might be able to help me out?
推荐答案
foo.bar
引用不应包含大括号:
The foo.bar
reference should not contain the braces:
<p ng-hide="foo.bar">I could be shown, or I could be hidden</p>
<p ng-show="foo.bar">I could be shown, or I could be hidden</p>
Angular 表达式 需要在花括号绑定中,而 Angular 指令 没有.
Angular expressions need to be within the curly-brace bindings, where as Angular directives do not.
另请参阅了解 Angular 模板.
这篇关于AngularJS:ng-show/ng-hide 不适用于 `{{ }}` 插值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!