在angularjs中输入无线电切换div

Question

我知道我可以切换div show / hide就是这么简单：

<input type="checkbox" ng-model="checked"><br />
<div class="check-element animate-show-hide" ng-show="checked">
  I show up when your checkbox is checked.
</div>

当输入类型是复选框时。 但我想有两个输入类型的无线电和切换两个div显示/隐藏。

<input type="radio" name="same" />
<input type="radio" name="same" />

怎么实现呢？ 工作的例子将是欣赏。

Answer 1

你试过这个吗？

<input type="radio" name="showDiv" ng-model="checked1"><br />
<input type="radio" name="showDiv" ng-model="checked2"><br />

<div class="check-element animate-show-hide" ng-show="checked">
  I show up when your checkbox1 is checked.
</div>
<div class="check-element animate-show-hide" ng-show="checked2">
  I show up when your checkbox2 is checked.
</div>

或者你想要一些特定的东西？

Answer 2

尝试这个

<input type="radio" name="same" ng-model="checked" value="true" />
<input type="radio" name="same" ng-model="checked" value="false" />
<div class="check-element animate-show-hide" ng-show="checked=='true'">
  I show up when your checkbox is checked.
</div>

Answer 3

 var myApp = angular.module('myApp',[]); myApp.controller('ctrl', ['$scope', function($scope) { $scope.checked = 'true'; }]); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="ctrl"> <input type="radio" ng-model="checked" value="true"> true <input type="radio" ng-model="checked" value="false">false <div class="check-element animate-show-hide" ng-show="checked"> I show up when your checkbox is checked. </div> </div>