title: AngularJS dynamic input value binding to an array model
body: <p>I am trying to dynamically generate a list of inputs and bind their values to a model's array property using AngularJS + jQuery.</p>
  
  <pre><code>...
  &lt;section ng-controller="MyController"&gt;
    &lt;button ng-click="addInput"&gt;Add new field&lt;/button&gt;
    &lt;section class="input-group"&gt;&lt;/section&gt;
  &lt;/section&gt;
  
  ...
  $scope.model = {
      'title': 'aaa',
      'arr': []
  };
  
  $scope.instructionCount = 0;
  
  $scope.addInput = function() {
      $model.arr.push('');
      $('.input-group').append(
          '&lt;input type="text"
           ng-bind="$scope.model.arr[' + ++$scope.instructionCount + ']"&gt;
      );
  };
  </code></pre>
  
  <p>Why doesn't this work?</p>