在移动角度UI上切换单选按钮

时间:2014-10-24 15:07:16

标签: javascript angularjs twitter-bootstrap angular-ui

我尝试在基于Mobile Angular UI的应用程序上的注册表单上放置两个单选按钮,但我遇到两个问题:

- 基于正常的bootstrap-angular应用程序选择一个无线电改变了视觉活动状态,但在我的情况下没有

-on chrome我遇到了以下问题:

 target' or 'target-class' attribute required with 'toggle' 
 <div class="btn-group" data-toggle="buttons">

这是我的小提琴:http://jsfiddle.net/187jab3k/

感谢您的支持。

2 个答案:

答案 0 :(得分:0)

试试这个:

<div class="btn-group" role="group">
   <button type="button" ng-model="gender" ng-click="color = 'mr';" class="btn btn-default">MR.
   </button>
   <button type="button" ng-model="gender" ng-click="color = 'mrs';" class="btn btn-default">MRS.
   </button>
</div>
<label>{{gender}}</label>

答案 1 :(得分:0)

我不知道为什么这会被低估......这是mobile-angular-ui的短暂结果。它还缺少移动设备所需的任何滑块控件。

我使用了一些按钮来模拟无线电行为:

  <div class="form-group has-success has-feedback">
    <label>Urgency:</label>
      <input type="hidden" ng-model="model.urgency">
      <button type="button" ng-click="model.urgency=0;" class="btn btn-default" ng-class="{'btn-primary': !model.urgency}">None</button>
      <button type="button" ng-click="model.urgency=1;" class="btn btn-default" ng-class="{'btn-primary': model.urgency==1}">Low</button>
      <button type="button" ng-click="model.urgency=2;" class="btn btn-default" ng-class="{'btn-primary': model.urgency==2}">Medium</button>
      <button type="button" ng-click="model.urgency=3;" class="btn btn-default" ng-class="{'btn-primary': model.urgency==3}">High</button>
    </div>

希望有人帮助......:〜