ng-show和ng-hide的進階應用

在數據列表渲染的時候，咱們可能不只有一層數據，多是三級甚至更多，若是咱們要顯示或者隱藏對應的數據，那麼就須要給數據進行子scope的綁定。以下

html

<div ng-app="demoApp">
    <table ng-controller="mainCtrl">
        <tr ng-repeat="app in apps" ng-model="app" ng-hide="app.hidden">
            <td>
                {{app.text}}
            </td>
            <td>
                <button ng-click="underCarriage($index)">hide</button>
            </td>
        </tr>
    </table>
</div>

javascript

app=angular.module('demoApp',[]);

app.controller('mainCtrl',function($scope){
    
    $scope.apps=[{text:"app1",hidden:false},
                 {text:"app2",hidden:false},
                 {text:"app3",hidden:false}];
    
    $scope.underCarriage=function(id){
        $scope.apps[id].hidden=true;
    };
});

多級應當按照此方式同步進行。

另，ng-show和ng-hide無需本身設置display屬性，若是本身設置了，將失去做用，小坑一個，坑的我不行。。。