title: AngularJS view not reflecting $scope.model, though data is being set
body: <p>Thank you so much for reading my question :)</p>
  
  <p>Aim: I want to persist a logged-in user's name and photo if they open a new tab or refresh. When originally authenticating (calling <code>attempt.login</code> on the form submit), the view updates fine (like so:)</p>
  
  <p>userController.js.coffee: </p>
  
  <pre><code>$scope.attemptLogin = -&gt;
    $scope.showLoginForm = false
    $http.post(apiURL + "/login"
      email: $scope.credentials.email
      password: $scope.credentials.password
    ).success (data) -&gt;
      if data.error
        console.log "error: " + data.error
      else
        $scope.user = data
        localStorageService.add("user", data)
  </code></pre>
  
  <p>The <strong>problem</strong> is that when I do a page load and try and set <code>$scope.user</code> from the local storage variable, (like so:) I see the <code>console.log $scope.user</code> just fine, but the view doesn't reflect any user data.</p>
  
  <p>userController.js.coffee:</p>
  
  <pre><code>$timeout -&gt;
    if localStorageService.get("user") == undefined
      $scope.user = {}
      $scope.loggedIn = false
      console.log "no user"
    else
      $scope.user = localStorageService.get("user")
      console.log $scope.user
      $scope.$digest()
  , 1
  </code></pre>
  
  <p>As you can see I've tried to put it in a <code>$timeout</code> block to force the change to take place on the next digest, and even explicitly called <code>$scope.$digest()</code>. I don't know where I'm going wrong here, I've scrounged around the other SO's to no avail apparently. Any lucidity on the matter is greatly appreciated!</p>
  
  <p>index.html:</p>
  
  <pre><code>&lt;div class="login-signup" ng-cloak ng-controller="userController"&gt;
    &lt;div class="user-details" id="user_details" ng-click="toggleUserMenu()" ng-show="loggedIn"&gt;
      &lt;div&gt;
        &lt;img class="user-avatar-small" ng-model="user.photo_url" ng-src="{{user.photo_url}}"&gt;
        &lt;div class="user-name" ng-model="user.name"&gt;
          {{user.name}}
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="user-menu" ng-show="loggedIn &amp;&amp; showUserMenu"&gt;
      &lt;a href ng-click="logOut()"&gt; Log Out&lt;/a&gt;
    &lt;/div&gt;
    &lt;a href ng-click="toggleLoginForm()" ng-show="!loggedIn &amp;&amp; !showLoginForm" ng-cloak&gt;Log In&lt;/a&gt;
    &lt;form class="form-inline" name="loginForm" ng-show="showLoginForm" ng-submit="attemptLogin()"ng-cloak&gt;
      &lt;span class="glyphicon glyphicon-remove-circle login-form-glyph" ng-click="toggleLoginForm()"&gt;&lt;/span&gt;
      &lt;label class="sr-only" for="email"&gt;email address&lt;/label&gt;
      &lt;input type="text" name="email" id="email" ng-model="credentials.email" placeholder="email" class="form-control"/&gt;
      &lt;br/&gt;
      &lt;label class="sr-only" for="password"&gt;password&lt;/label&gt;
      &lt;input type ="password" name="password" id="password" ng-model="credentials.password" placeholder="password" class="form-control"/&gt;
      &lt;br/&gt;
      &lt;input class="form-control" type="submit"&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>