title: Trying to populate a dropdown list from a REST call using angular
body: <p>I was using this thread as a reference <a href="https://stackoverflow.com/questions/15688313/how-can-i-populate-a-select-dropdown-list-from-a-json-feed-with-angularjs">How can I populate a select dropdown list from a JSON feed with AngularJS?</a> </p>
  
  <p>My code does not throw any errors, but the dropdown list does not contain any of the values expected. The data is successfully grabbed from the api call and stored into the variable $scope.dataTypes. </p>
  
  <p>At execution time, </p>
  
  <pre><code>$scope.dataTypes = ['string', 'integer', 'double']
  </code></pre>
  
  <p>But again, the dropdown list is empty. The other two variables, TemplateName and ColumnCount are displaying correctly. </p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;script src="~/Scripts/angular.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          function GetDataTypes($scope, $http) {
              $scope.dataTypes = [];
              $scope.TemplateName = 'NameTest';
              $scope.ColumnCount = '20';
              $http({
                  method: 'GET',
                  url: 'http://localhost:60568/GetDataTypes'
              }).then(function (result) {
                  $scope.dataTypes = result.data.Result;
                  console.log(dataTypes);
              });
          }
          var myApp = angular.module("myApp", []);
          myApp.controller("GetDataTypes", GetDataTypes);
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body ng-app="myApp"&gt;
      &lt;div id="TemplateScreen" ng-controller="GetDataTypes"&gt;
          TemplateName :- &lt;input ng-model="TemplateName" type="text" id="TemplateName" value="" /&gt;&lt;br /&gt;
          ColumnCount :- &lt;input ng-model="ColumnCount" type="text" id="ColumnCount" value="" /&gt;&lt;br /&gt;
          Select DataType :-
              &lt;select ng-model="dataTypes"&gt;
                  &lt;option value=""&gt;&lt;/option&gt;
              &lt;/select&gt;
          &lt;div id="divTemplateName"&gt;{{TemplateName}}&lt;/div&gt;
          &lt;div id="divColumnCount"&gt;{{ColumnCount}}&lt;/div&gt;&lt;br /&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Console Output of $scope.dataTypes at execution time</p>
  
  <pre><code>(5) ["INTEGER_DATATYPE", "STRING_DATATYPE", "DOUBLE_DATATYPE", "BOOL_DATATYPE", "CHAR_DATATYPE"]
  </code></pre>