title: Dynamically change gridOptions columnDefs
body: <p>In the following plunkr I want the Gender dropdown filter to be populated dynamically by the ajax call, but it doesn't appear to work.</p>
  
  <p><a href="http://plnkr.co/edit/FbRM0svqmE37CxwZo8oh?p=preview" rel="nofollow">plunkr link</a></p>
  
  <p>If I comment out line 17 </p>
  
  <pre><code>$scope.newSelectOptions=[{"value":"New Item 1","label":"New Item 1"},{"value":"New Item 2","label":"New Item 2"},{"value":"New Item 3","label":"New Item 3"},{"value":"New Item 4","label":"New Item 4"}];
  </code></pre>
  
  <p>it works like I would like (just simulating it), but what appears to happen is that the ajax call populates the variable <code>$scope.newSelectOptions</code> after the <code>columnDefs</code> has been created.</p>
  
  <p>I have tried changing line 34:</p>
  
  <pre><code>selectOptions: $scope.newSelectOptions
  </code></pre>
  
  <p>to:</p>
  
  <pre><code>selectOptions: newSelectOptions
  selectOptions: 'newSelectOptions'
  selectOptions: '$scope.newSelectOptions'
  </code></pre>
  
  <p>but none of them work.</p>
  
  <p>So how can I dynamically alter that <code>selectOptions</code> or other objects within the <code>$scope.gridOptions.columnDefs</code> dynamically?</p>