title: Angular display a single record from json
body: <p>I've just started getting into using Angular and having an issue displaying a single record that is being returned from using $http (get).  I'm getting the data back correctly.  This is the html I've got....</p>
  
  <pre><code>&lt;div ng-controller="UserDataController as udCtrl"&gt;
      Name: {{udCtrl.user.name}}
  &lt;/div&gt; 
  
  &lt;div id="debug" style="margin-top:24px;border:solid 1px #900;background:#efefef;min-height:100px"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>have also tried and a couple of other variations...</p>
  
  <pre><code>Name: {{udCtrl.name}}
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>(function() {
  
  var app = angular.module('rtcTimesheet', []);
  var servicePath="/angular/";
  $("#debug").append("Starting...&lt;br/&gt;");
  
  app.controller("UserDataController",["$http",function($http){
  
      var user=this;
      user=[];
  
      $http({
          method:     'GET',
          url:        servicePath+'login.php',
          params: {
              un:     "username",
              pwd:    "123456789"
          }
      }).then(function(response){
  
          if(response.data.hasOwnProperty("HasError")) {
              $("#debug").append("ERROR: " + response.data.ErrorMessage);
          } else {
              $("#debug").append("Data: " + JSON.stringify(response.data));
              user=response.data;
          }
  
      },function (err){
          alert("ERROR: "+err.status); //data, status, headers, config, statusText
      });
  
  }]);
  
  app.controller("UserTest",function(){
      this.user=users;
  });
  
  var users = {
                  id: '1',
                  name: 'Joe Bloggs'
                  };
  
  })();
  </code></pre>
  
  <p>This is what is returned in JSON format and I can see this in the little debug area I created.</p>
  
  <pre><code> {"data":{"id":"1","name":"Joe Bloggs"}
  </code></pre>
  
  <p>if I change the html to use the code below it works.</p>
  
  <pre><code>&lt;div ng-controller="UserTest as udCtrl"&gt;
      Name: {{udCtrl.user.name}}
  &lt;/div&gt; 
  </code></pre>
  
  <p>I just cannot see where I'm going wrong and why it will not display the returned name.</p>