title: in angularjs, how do you get a `select` to refresh when the array for ng-options changes?
body: <p>have an <code>select</code> based on any array.  the elements in the array may change.  how do I get the angular controller to refresh the array?</p>
  
  <h3>module.js</h3>
  
  <pre>
  var langMod = angular.module('langMod', []);
  langMod.controller( .controller( 'colorCntl', function($scope) {
    $scope.color = 'wt';
    $scope.colorArr = [
      { id: 'br', name: 'brown' },
      { id: 'wt', name: 'white' }
    ];
  });
  </pre>
  
  <h3>index.html</h3>
  
  <pre>
  &lt;form ng-controller='wordCntl' >
    &lt;select ng-model="color" ng-options="c.id as c.name for c in colorArr">
       &lt;option value=''>-- chose color --&lt;/option>
    &lt/select>
  &lt;/form>
  </pre>
  
  <h3>from the console:</h3>
  
  <pre>
  &gt; scope = angular.element(document.querySelector('select')).scope();
  &gt; scope.colorArr.push( { id:'bk', name:'black' } );
    3
  note! the select dropdown still only has brown and white, not black
  </pre>
  
  <p>how do I get the <code>select</code> to refresh so that all elements in <code>colorArr</code> are options?</p>