title: angularjs ng-model not binding after state change
body: <p>There are three states defined in my project called "/projects","/pages" and "/settings". The function given below works without any problem <strong>in case not state changing</strong> (I also tried with ngRoute but the result was same). But when I started to change states and then get back to the same page this function not binding data to the modal box. <strong>[There is no error occurred in this situation!]</strong> <strong>(when I'm refreshing page it turns back to normal)</strong>. </p>
  
  <p>My <strong>app.js</strong> file</p>
  
  <pre><code>// Dependencies wired beforehand.
  /** @var {Object} projects Page management page state */
  var projects = {
      name: 'projects',
      url: '/projects',
      templateUrl: TEMPLATES_DIR + 'projects.html',
      controller: 'projects'
  };   
  
  /** @var {Object} pages Page management page state */
  var pages = {
      name: 'pages',
      url: '/pages',
      templateUrl: TEMPLATES_DIR + 'pages.html',
      controller: 'pages'
  };
  
  /** @var {Object} settings Settings page state */
  var settings = {
      name: 'settings',
      url: '/settings',
      templateUrl: TEMPLATES_DIR + 'settings.html',
      controller: 'settings'
  };
  
  $stateProvider.state(projects);
  $stateProvider.state(pages);
  $stateProvider.state(settings);
  </code></pre>
  
  <p>Function from <strong>projects</strong> controller: (This function binds data to modal box) </p>
  
  <pre><code>$scope.getProjectImages = function(id) {
      $scope.projectId = id;
  
      projectsFactory.getImages(id).then(function(response) {
          $scope.images = response.data;
          //I can see that it's holding array but it's not binding data to modal box anymore when the state changed
          alert($scope.images); 
  
      });
  };
  </code></pre>
  
  <p>template file <strong>(UPDATED)</strong>:</p>
  
  <pre><code>&lt;div id="project-image-manager" class="uk-modal-container uk-position-z-index" uk-modal="stack: true; bg-close: false; container: false"&gt;
      &lt;div class="uk-modal-dialog uk-modal-body"&gt;
          &lt;button class="uk-modal-close-default" type="button" ng-click="resetProjectImagesModal()" uk-close&gt;&lt;/button&gt;
          &lt;div class="uk-grid-divider" uk-grid&gt;
              &lt;div class="uk-animation-slide-bottom-medium uk-width-1-3@m uk-margin-medium-top"&gt;
                  &lt;h3&gt;Image Attachment&lt;span class="uk-display-block uk-text-small"&gt;File Management&lt;/span&gt;&lt;/h3&gt;
                  &lt;form method="post" enctype="multipart/form-data"&gt;
                      &lt;button ngf-select="uploadImage($files)" class="uk-button uk-margin-bottom uk-button-default uk-text-capitalize uk-text-left" accept="image/*" multiple&gt;Upload Images&lt;span class="uk-icon uk-margin-small-left" uk-icon="icon: image"&gt;&lt;/span&gt;&lt;/button&gt;
                  &lt;/form&gt;
                  &lt;p&gt;{{ errorMsg }}&lt;/p&gt;
                  &lt;progress class="uk-progress" value="{{ progress }}" max="100"&gt;&lt;/progress&gt;
                  &lt;ul class="uk-list uk-text-small uk-margin-large-top uk-list-divider"&gt;
                      &lt;li ng-repeat="file in files"&gt;{{ file.name }}&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div class="uk-width-expand@m"&gt;
                  &lt;div class="uk-background-default uk-padding-bottom uk-width-expand uk-text-center" ng-if="images.length"&gt;
                      &lt;p class="uk-animation-slide-left-small" ng-if="sortableImages.disabled"&gt;
                          &lt;span class="uk-icon uk-margin-small-right" uk-icon="icon: lock"&gt;&lt;/span&gt;&lt;a class="uk-text-muted uk-link-reset" ng-click="sortableImages.disabled = false"&gt;Unlock to sort images&lt;/a&gt;
                      &lt;/p&gt;
                      &lt;p class="uk-animation-slide-left-small" ng-if="!sortableImages.disabled"&gt;
                          &lt;span class="uk-icon uk-margin-small-right" uk-icon="icon: unlock"&gt;&lt;/span&gt;&lt;a class="uk-text-muted uk-link-reset" ng-click="sortableImages.disabled = true"&gt;Lock sorting&lt;/a&gt;
                      &lt;/p&gt;
                  &lt;/div&gt;
                  &lt;h3 class="uk-animation-fade uk-text-center uk-text-muted uk-margin-large-top uk-align-center" ng-show="!images.length"&gt;
                      &lt;span class="uk-icon uk-display-block" uk-icon="icon: image; ratio: 4"&gt;&lt;/span&gt;This project has no images.
                  &lt;/h3&gt;
                  &lt;div ng-if="images.length"&gt;
                      &lt;ul class="uk-animation-fade uk-list uk-margin-medium-top" ng-model="images" ui-sortable="sortableImages"&gt;
                          &lt;li class="uk-margin-medium-bottom" ng-model="images" ng-repeat="image in images"&gt;
                              &lt;div uk-grid&gt;
                                  &lt;div class="uk-width-1-2@m uk-width-1-3@s mobile-width-image sortable-image-item"&gt;
                                      &lt;div class="uk-background-cover uk-width-1-4@xs uk-panel uk-flex uk-flex-center uk-flex-middle image-thumbnail-height" style="background-image: url({{ uploadPath }}{{ image.url }});"&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class="uk-width-1-2@m uk-width-2-3@s mobile-width-text"&gt;
                                      &lt;p class="uk-text-muted" ng-if="!image.description.length"&gt;No description given.&lt;/p&gt;
                                      &lt;p&gt;{{ image.description }}&lt;/p&gt;
                                      &lt;hr class="uk-divider-small uk-margin-top uk-margin-bottom"&gt;
                                      &lt;ul class="uk-iconnav uk-padding-remove-left"&gt;
                                          &lt;li&gt;
                                              &lt;a ng-click="getImageDescription(image.id)" uk-icon="icon: file-edit" uk-toggle="target: #add-description"&gt;&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
                                              &lt;a ng-click="removeImage(image)" uk-icon="icon: trash"&gt;&lt;/a&gt;
                                          &lt;/li&gt;
                                      &lt;/ul&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What's wrong with that code? My last plan giving up doing in SPA and go with traditional routing. :D Thanks for your help.</p>