Javascript AngularJS折叠展开ng在展开另一个时重复项
所以我理解在某种程度上使用AngularJS扩展和折叠div背后的复杂想法,而不是全部。因此,我知道如何在ng repeat中重复和展开/折叠ng repeat中的多个对象及其值等。我遇到的问题是,如果在ng repeat中已展开一个项目,并且我单击展开另一个项目,我希望当前展开的项目在展开新项目时自动折叠。此外,我应该能够在相同的项目上单击展开/折叠,而不会出现问题。我撞到了一堵墙,我试着想弄清楚我在做什么。我的实际工作是通过折叠和扩展来完成的,我唯一不能得到的就是在我扩展另一个项目时让一个项目折叠 例如,我在下面提供了从头开始的代码: VA嗯,首先要做的事情是: 当使用ng click、ng show或任何不使用{{}的ng属性时,值将自动正确解释 所以你不想写Javascript AngularJS折叠展开ng在展开另一个时重复项,javascript,html,angularjs,Javascript,Html,Angularjs,所以我理解在某种程度上使用AngularJS扩展和折叠div背后的复杂想法,而不是全部。因此,我知道如何在ng repeat中重复和展开/折叠ng repeat中的多个对象及其值等。我遇到的问题是,如果在ng repeat中已展开一个项目,并且我单击展开另一个项目,我希望当前展开的项目在展开新项目时自动折叠。此外,我应该能够在相同的项目上单击展开/折叠,而不会出现问题。我撞到了一堵墙,我试着想弄清楚我在做什么。我的实际工作是通过折叠和扩展来完成的,我唯一不能得到的就是在我扩展另一个项目时让一个项
ng-click="{{place.state}}.expanded=!{{place.state}}.expanded)"
而是(最后有一个额外的“)”
另外-您使用了ng repeat,这很好-但是-在ng单击中,您尝试在字符串上设置属性。。。那不行。相反,您应该将属性设置为“place”
这些更改将为您提供展开/折叠行为。为了实现您想要的功能,我建议您添加一个管理折叠/展开行为的函数。
基本思想是,您“记住”它们展开的内容,这样您就可以“折叠”先前展开的元素。或者,您也可以迭代JSON数据对象并将所有值重置为折叠(如果您有大量数据,则可能不应该这样做)
这里有一个可以满足您需求的快速抢注器:
基本思想是有两个范围变量,一个用于已扩展的州,另一个用于已扩展的城市。如果用户单击某个州,则已扩展的州将被折叠,单击的州将被扩展…城市也是如此。好吧,首先:
当使用ng click、ng show或任何不使用{{}的ng属性时,值将自动正确解释
所以你不想写
ng-click="{{place.state}}.expanded=!{{place.state}}.expanded)"
而是(最后有一个额外的“)”
另外-您使用了ng repeat,这很好-但是-在ng单击中,您尝试在字符串上设置属性。。。那不行。相反,您应该将属性设置为“place”
这些更改将为您提供展开/折叠行为。为了实现您想要的功能,我建议您添加一个管理折叠/展开行为的函数。
基本思想是,您“记住”它们展开的内容,这样您就可以“折叠”先前展开的元素。或者,您也可以迭代JSON数据对象并将所有值重置为折叠(如果您有大量数据,则可能不应该这样做)
这里有一个可以满足您需求的快速抢注器:
基本思想是有两个作用域变量,一个用于已扩展的州,另一个用于已扩展的城市。如果用户单击某个州,则已扩展的州将被折叠,单击的州将被扩展…城市也是如此。这太完美了!非常感谢!也感谢您正确解释属性s更多关于我的信息。我不是这方面的专家,你解决了我的一些问题。这太完美了!非常感谢!也感谢你向我正确解释属性设置。我不是这方面的专家,你解决了我的一些问题。
$scope.data = [{
"state": "VA",
"value": '14',
"city": [{
"cName": 'Virginia Beach',
"pop": '650,000'
}, {
"cName": 'Richmond',
"pop": '850,000'
}]
}, {
"state": "TX",
"value": '31',
"city": [{
"cName": 'Austin',
"pop": '990,000'
}, {
"cName": 'Houston',
"pop": '1,450,000'
}]
}];
ng-click="{{place.state}}.expanded=!{{place.state}}.expanded)"
ng-click="place.state.expanded= !place.state.expanded"
ng-click="place.expanded= !place.expanded"