你能告诉我如何展示和隐藏角度元素吗?在下面的示例中,我想最初隐藏#item-details和显示它,如果选中复选框或隐藏,如果取消选中
<!DOCTYPE html>
<html ng-app="app">
<body>
<div class="container" ng-controller="checkController">
<div class="row">
<div class="col-md-2"><input type="checkbox" name="item" value="new" />Add New Item <br /></div>
<div class="col-md-6" id="item-details" ng-show="">
<div class="btn-group" role="group" aria-label="...">
<button type="button" class="btn btn-default">Left</button>
<button type="button" class="btn btn-default">Middle</button>
<button type="button" class="btn btn-default">Right</button>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js">/script>
<script>
var app = angular.module('app', [])
.controller('checkController', function() { });
this.
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
首先将模型分配给复选框
<div class="col-md-2"><input type="checkbox" name="item" value="new" ng-model="checked" />Add New Item <br /></div>
Run Code Online (Sandbox Code Playgroud)
然后简单地将相同的模型值分配给ng-show中的项目详细信息
<div class="col-md-6" id="item-details" ng-show="checked">
Run Code Online (Sandbox Code Playgroud)
你完成了
| 归档时间: |
|
| 查看次数: |
9018 次 |
| 最近记录: |