即使列表是ngRepeat也不会更新

Question

I'm having a problem where despite a list being updated, ngRepeat does not display the information.

In the code below, the $scope.selectedImages array is being added to when images are selected using the file input. It is set up so that only unique files will be added to the list of selectedImages (no duplicates).

At the end of the function, scope.selectedImages prints the array with the new values, but in the view, ngRepeat does not add the new list items with the image names.

Other questions regarding this issue said that $scope.$apply should fix the problem, but for me it is not. Am I using it wrong or is there something else that I am misunderstanding.

EDIT: View 1 and View 2 are in separate HTML pages that both rely on the same controller.

View 1:

<input type="file" multiple accept="image/*" class="file-input" id="img-upload-btn" onchange="angular.element(this).scope().select(this)">
<md-button class="md-primary md-raised sidenav-btn" ng-click="proxy('img-upload-btn')">
  Select <strong>Images</strong>
</md-button>

The proxy function allows the md-button to click the input.

View 2:

<div layout-padding flex ng-controller="upload-controller">
  <ul>
    <li ng-repeat="im in selectedImages">{{im.name}}</li>
  </ul>
</div>

Controller:

$scope.selectedImages = [];
$scope.select = function(element) {
  $scope.$apply(function(scope) {
    var justFiles = $.map(element.files, function(val, key) {
      return val;
    }, true);

    var fileEquality = function(f1, f2) {
      if (f1.name != f2.name) return false;
      if (f1.size != f2.size) return false;
      if (f1.type != f2.type) return false;
      if (f1.lastModified != f2.lastModified) return false;
      return true;
    }

    // inefficient, find better way later
    for (i in justFiles) {
      var contains = false;
      var file = justFiles[i];
      for (i in scope.selectedImages) {
        if (fileEquality(file, scope.selectedImages[i])) {
          contains = true;
          break;
        }
      }
      if (!contains) scope.selectedImages.push(file);
    }
    console.log(scope.selectedImages);
  });
};

Answer 1

Your input field template and controller template have to different scopes. Use $rootScope.selectedImages in your case.