1

我指的是使用 Jquery 编写的这个小提琴http://jsfiddle.net/9HXzW/55/ 。

HTML中的代码是，

<div id="right-column-sidebar">
    <ol>
        <li><input type="checkbox"/>Check box 1</li>
        <li><input type="checkbox"/>Check box 2</li>
        <li><input type="checkbox"/>Check box 3</li>
        <li><input type="checkbox"/>Check box 4</li>
        <li><input type="checkbox"/>Check box 5</li> 
    </ol>
</div>
<a class="button" href="#"><span>Show Check Box</span></a>

而jQuery是，

 $('div#right-column-sidebar ol li:gt(0)').hide();
$('a.button').on("click", function() { 
    $('div#right-column-sidebar ol li:gt(0)').slideToggle(); 
});

我想要angularjs中的功能，在单击按钮时，按钮应该切换并显示复选框列表。我应该在小提琴中做些什么改变？

4

1 回答 1

4

单击按钮时，只需调整 的值displayCheckBox。休息将由 angularjs 处理

<div ng-show="displayCheckBox">
    <ol>
        <li><input type="checkbox"/>Check box 1</li>
        <li><input type="checkbox"/>Check box 2</li>
        <li><input type="checkbox"/>Check box 3</li>
        <li><input type="checkbox"/>Check box 4</li>
        <li><input type="checkbox"/>Check box 5</li> 
    </ol>
</div>

<a class="button" href="#" ng-click="displayCheckBox=!displayCheckBox"><span>Show Check Box</span></a>

Working Demo

于 2013-10-04T14:47:02.403 回答