问题描述
我在html里面动态设置了p的id代码如下：
<p ng-repeat='item in items'> <p class='ng-hide'> {{item.name}} </p><p>
html解析之后能出来动态id的效果，类似于这样：
<p ng-repeat='item in items'> <p class='ng-hide'> name1 </p> <p class='ng-hide'> name2 </p> <p class='ng-hide'> name3 </p><p>
我想要动态的控制这些p显示还是不显示。我在js里面写了这样的代码：
html:<input type='button' ng-click='show(item.name)'>js:$scope.show=function(name){ document.getElementById(name).style.display = 'block';}
结果并没有实现我想要的效果，还是每次点击都会显示三个p。有什么办法能实现我想要的效果么？
问题解答
回答1：虽然不明白为什么，但是我把class='ng-hide'改成了style=“desplay:none”就可以了。。。
回答2：用ng-show和ng-hide行不行
回答3：item里面加一个字段'isShow', 默认值为false，
<p ng-repeat='item in items'> <p ng-show='item.isShow'> {{item.name}} </p><p>
点击按钮的时候，isShow的值制反。
html:<input type='button' ng-click='show(index)'>js:$scope.show=function(index){ $scope.items[index].isShow = !$scope.items[index].isShow;}回答4：
在angular.js中控制元素显示的有两个方式 第一个是:ng-show ng-hide 还有一个是ng-if
回答5：建议把你的数据重新组织一下，用ng-hide控制元素隐藏与否：
`[ {id:’id1’,name:’name1’,hide:false //配合nd-hide实现元素隐藏和显示 }, {id:’id2’name:’name2’,hide:true } //...]----------<p ng-repeat='item in items'> <p ng-hide='item.hide' ng-bind='item.name'></p><p>`写的比较简单，有问题再问回答6：
再加一个属性，写到p的自定义属性上去，然后ng-if做判断？
回答7：https://github.com/xufei/ng-c...
