AngularJS nút radio Bootstrap nhóm

Question

Tôi cố gắng để thiết lập một nhóm nút radio bằng cách sử dụng hướng dẫn tại đây:

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

Vì vậy, theo quan điểm của tôi, tôi tạo này:

<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> 

Vấn đề của tôi là tôi không thể chọn nút được chọn. Trong ví dụ của chúng, chúng có các boolean khác nhau cho mỗi nút, nhưng tôi phải chia sẻ boolean, vì vậy nếu giá trị boolean là true thì nút "Để phân phối" phải hoạt động, nếu giá trị là false thì "Đối với bộ sưu tập" sẽ hoạt động.

Tôi đã cố gắng làm việc đó như thế này:

<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> 

nhưng điều đó có cùng một vấn đề. Có ai biết cách tôi có thể làm cho nó chọn nút dựa trên giá trị của tôi không?

Answer 1

Đề cập đến ví dụ được đưa ra trong 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> 

Khi radioModel='Left' nút trái được chọn.

Đối với kịch bản của bạn, một số tùy chọn bị thiếu. Dưới đây là đoạn code làm việc

<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