AngularJS input type problem

HTML

<div ng-app="">
  <div ng-controller="MyCtrl">
      a: <input id='input_a' ng-model='numbers.a' type='number'><br>
      b: <input ng-model='numbers.b' type='{{"number"}}'><br>
      c: <input ng-model='numbers.c' type='checkbox'>
      d: <input ng-model='numbers.d' type='{{"checkbox"}}'>
          <div>
          Watch: <pre>{{numbers}}</pre>
          "b" turns to string.<br>
          "d" won't change.
              
          </div>
  </div>
  
  <h>input_a: {{input_a.$valid}}</h>
  
</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
<style>
div.ng-invalid { border: 1px solid red; }

JavaScript

function MyCtrl($scope) {
    $scope.numbers = {a: 5, b: 6, c: true, d: true}
}