title: binding radio buttons to ng-model with angularjs
body: <p>So this is the relevant part of my html-code. i tried binding the "formFriendsAll" scope to the ng-model.</p>
  
  <pre><code>&lt;form ng-submit="submitForm()" &gt;
     &lt;div class="col-sm-3"&gt;
      &lt;div class="form-group"&gt; 
       &lt;label&gt;Which Persons to show?&lt;/label&gt;
        &lt;div class="radio"&gt;
          &lt;label&gt;
            &lt;input type="radio" name="FriendsAll" ng-model="formFriendsAll" value="Friends" &gt;
            Friends
          &lt;/label&gt;
          &lt;/div&gt;
           &lt;div class="radio"&gt;
            &lt;label&gt;
             &lt;input type="radio" name="FriendsAll" ng-model="formFriendsAll" value="Alle"&gt;
             All
            &lt;/label&gt;
            &lt;/div&gt;
            &lt;div&gt;currently selected: {{formFriendsAll}}&lt;/div&gt;
           &lt;/div&gt;           
          &lt;/div&gt;&lt;td&gt;&lt;input type="submit" class="btn btn-primary" value="Los!"/&gt;&lt;/td&gt; &lt;/form&gt;    
  </code></pre>
  
  <p>This is the relevant js-code:</p>
  
  <pre><code> var challenge =  angular.module('challengeApp', []) 
      challenge.controller('challengeController', function($scope) {   
  
        $scope.submitForm = function () {
        alert($scope.formFriendsAll);   
  };  
  
      $scope.formFriendsAll = 'Friends';
  
  });
  </code></pre>
  
  <p>I used the alert to test the change of value when i hit the submit button but i tried various methods like ng-changed, ng-click, ng-value. but nothing helped me solve the issue that my alert and "currently selected" stays on "Friends"</p>
  
  <p>Any suggestions?</p>