-
因为上半部分和下一部分显示的字段数不同。不同情况下显示的字段数是不同的。此外，编辑和显示之间还存在状态切换，因此必须实现自己的手风琴效果。
最初的想法是用CSS做动态效果变换，点击细节按钮（或者中间部分的下拉图标）请求数据的详细信息，然后将部分细节的高度设置为指定的高度，再单击细节按钮（或者中间部分的下拉部分是折叠的，图标的细节）。
但问题是我们如何精确地控制哪一行来总结数据的细节，并关闭其他行的细节。经过一些考虑，我决定利用双向数据绑定来帮助我完成这项工作：
Js：
scope.toogleshowdtl美元=功能（项目，e）{
停止事件
e.stoppropagation（）；
对于（var i = 0；我的<< scope.orderhdr.length美元；i++）{
如果（美元范围。orderhdr {我}。bill_hdr_id！=项目。bill_hdr_id）{
美元的范围。orderhdr {我}。mxshow = false；
美元的范围。orderhdr {我}。iconchange =glyphicon glyphicon菜单；
}
}
开关（项目。mxshow）{
案例定义：
item.mxshow =真；
item.iconchange =glyphicon glyphicon菜单；
打破；
情况真的：
item.mxshow = false；
item.iconchange =glyphicon glyphicon菜单；
打破；
案例假：
item.mxshow =真；
item.iconchange =glyphicon glyphicon菜单；
打破；
违约:
item.mxshow = false；
item.iconchange =glyphicon glyphicon菜单；
打破；
}
}
HTML：
细节
当单击事件被触发时，当前行中的数据没有mxshow场，如此循环添加到域和指定错误。The currently clicked row cannot perform this operation, otherwise the details will not be displayed when the first click is taken.The following switch case statement guarantees the problem that the first click of mxShow is no value and the mxShow value switch.The value of item.iconChange is used to control the switchover of middle Font Icon. 当未显示细节时，图标向下，并且可以扩展代表。当显示细节时，图标向上，代表可以缩回。
NG秀=o.mxshow决定的细节显示在mxshow价值的基础上。
类={ } } { o.iconchange glyphicon glyphicon菜单
用于切换图标
最后的效果图如下（不知道如何上传O（动态图形如O /人））
以上是小编给agularjs神奇的双向数据绑定介绍手风琴效果的实现，希望对你有帮助，如果您有任何问题，请给我留言，萧边会及时回复你。谢谢你的支持网站。