[英]Angular ng-hide with a dynamic flag
I have a table which has row grouping based on one of the fields value. 我有一个表,其中具有基于字段值之一的行分组。 The grouping is working.
分组正在工作。 I am using
ng-hide
to expand and collapse. 我正在使用
ng-hide
展开和折叠。 By default i want the first group to be expanded and other groups to collapse. 默认情况下,我希望第一个组扩展而其他组收缩。 i was using a flag variable like
ng-hide="flag"
. 我正在使用
ng-hide="flag"
类的标志变量。
This flag was causing all the groups to either expand or collapse. 此标志导致所有组扩展或折叠。
can i set this flag conditionally on runtime based on which ng-hide
works dynamically. 我可以根据
ng-hide
动态运行情况在运行时有条件地设置此标志。 I have tried adding a javascript function and calling it in ng-hide="funct()" that did not work. 我尝试添加一个javascript函数,并在ng-hide =“ funct()”中调用它,但该方法无效。
<tbody ng-repeat="group in $groups" class="ng-cloak" >
<tr >
<td class="ng-cloak" >
<a href="" ng-click="flag = !flag" >
<span ng-show="flag"><i class="icon-fixed-width"></i></span>
<span ng-show="!flag"><i class="icon-fixed-width"></i></span>
</a>
{{group.value}}
</td>
</tr>
<tr ng-hide ="flag" ng-repeat="x in group.data | filter:query| orderBy:predicate:reverse " >
</tr>
</tbody>
You could use the ng-init
directive to initialize the flag with a function call: 您可以使用
ng-init
指令通过函数调用来初始化标志:
<tr ng-init="flag = someFunction()">
Here's a jsfiddle to demonstrate this example. 这是一个jsfiddle来演示此示例。
Here's an updated demo using your markup: http://jsfiddle.net/gion_13/dTPvE/2/ . 这是使用您的标记的更新的演示: http : //jsfiddle.net/gion_13/dTPvE/2/ 。
You can use $index og ng-repeat. 您可以使用$ index og ng-repeat。 There are different variable of ng-repeat, $index,$first,$last etc. You use somthing like
有不同的变量ng-repeat,$ index,$ first,$ last等等。
ng-hide="$index==1" ng-hide =“ $ index == 1”
Use ng-init
like this: 像这样使用
ng-init
:
<tbody ng-repeat="group in $groups" class="ng-cloak" ng-init="flag = !$first">
The fiddle: http://jsfiddle.net/dTPvE/4/ 小提琴: http : //jsfiddle.net/dTPvE/4/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.