AngularJS Bootstrap 单选按钮组

Question

我正在尝试使用此处的教程设置单选按钮组:

https://angular-ui.github.io/bootstrap/

所以在我看来，我创建了这个:

<div class="form-group">
    <div class="btn-group">
        <label class="btn btn-primary" ng-model="controller.selectedLines[0].forDelivery">For delivery</label>
        <label class="btn btn-primary" ng-model="!controller.selectedLines[0].forDelivery">For collection</label>
    </div>
</div>

我的问题是我无法选择要选择的按钮。
在他们的示例中，每个按钮都有不同的 bool 值，但我的必须共享 bool 值，所以如果 bool 值为 真实 如果值为 ，则“交货”按钮应处于事件状态假 那么“收集”应该是事件的。

我试着这样做:

<div class="form-group">
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-default" ng-class="active: controller.selectedLines[0].forDelivery === true">
            <input type="radio" name="optionsRadios" ng-model="controller.selectedLines[0].forDelivery" ng-value="true" ng-change="deliveryController.requestDeliveryDate(controller.order, controller.selectedLines)"> For delivery
        </label>
        <label class="btn btn-default" ng-class="active: controller.selectedLines[0].forDelivery === false">
            <input type="radio" name="optionsRadios" ng-model="controller.selectedLines[0].forDelivery" ng-value="false" ng-change="deliveryController.requestDeliveryDate(controller.order, controller.selectedLines)"> For collection
        </label>
    </div>
</div>

但这有同样的问题。
有谁知道我怎样才能让它根据我的值(value)选择按钮？

Answer 1

引用 https://angular-ui.github.io/bootstrap/ 中给出的示例

<div class="btn-group">
    <label class="btn btn-primary" ng-model="radioModel" btn-radio="'Left'">Left</label>
    <label class="btn btn-primary" ng-model="radioModel" btn-radio="'Middle'">Middle</label>
    <label class="btn btn-primary" ng-model="radioModel" btn-radio="'Right'">Right</label>
</div>

当 radioModel='Left'左键被选中。

至于您的方案，缺少一些选项。这是工作代码

<div class="btn-group">
    <label class="btn btn-primary" ng-model="mode" btn-radio="'Delivery'">For delivery</label>
    <label class="btn btn-primary" ng-model="mode" btn-radio="'Collection'">For collection</label>
</div>

Demo