AngularJS Bootstrap Radiobutton Gruppe

Question

Ich versuche, eine Optionsfeldgruppe mit dem Tutorial von hier einzurichten:

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

Also meiner Meinung nach habe ich dies:

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

Mein Problem Ist die Schaltfläche nicht ausgewählt? In ihrem Beispiel hatten sie unterschiedliche booleans für jede Schaltfläche, aber meins muss den booleschen Wert teilen, also wenn der boolesche Wert true ist, dann sollte die Schaltfläche "Für Zustellung" aktiv sein, wenn der Wert false dann die "Zur Sammlung" sollte aktiv sein.

Ich habe versucht, es so zu tun:

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

aber das hatte das gleiche Problem. Weiß jemand, wie ich es bekommen kann, um die Schaltfläche basierend auf meinem Wert auszuwählen?

Answer 1

zum Beispiel in https://angular-ui.github.io/bootstrap/ gegeben Bezugnahme

<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' Wenn die linke Taste ausgewählt wird.

Wie für Ihr Szenario fehlen einige Optionen. Hier ist der Arbeitscode

<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