title: Bind Bootstrap Radio Button To Angular Property
body: <p>I am having troubles getting a bootstrap radio box selection to bind into an angular property.</p>
  
  <p>Here is what I have, it is not working.</p>
  
  <p>HTML BOOTSTRAP</p>
  
  <pre><code> &lt;div class="btn-group" data-toggle="buttons"&gt;
            &lt;label class="btn btn-success active"&gt;
              &lt;input type="radio" value="bill" ng-model="newItemType" name="options" id="option1" autocomplete="off" checked&gt; Insert New Bill &lt;span class="glyphicon glyphicon-file"&gt;&lt;/span&gt; 
            &lt;/label&gt;
            &lt;label" class="btn btn-success "&gt;
              &lt;input type="radio" value="coin" ng-model="newItemType" name="options" id="option2" autocomplete="off"&gt; Insert New Coin &lt;span class="glyphicon glyphicon-adjust"&gt;&lt;/span&gt;  
            &lt;/label&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>ANGULAR JAVASCRIPT</p>
  
  <pre><code>var CurrencyInventoryBillController = function($scope, $http)
  {
      $scope.newItemType = "NOT SELECTED";
  
      //TRIGGERED ON BUTTON CLICK. ALERT SHOWS 'NOT SELECTED' REGARDLESS OF WHICH RADIO BTN IS SELECTED
      $scope.insertNewCurrencyItem = function()
      {
          alert($scope.newItemType);
      }
  
  }
  </code></pre>
  
  <p>Why is the VALUE and NG-MODEL directives not changing the SCOPE variable in this case?</p>