0

У меня проблема, несмотря на то, что, несмотря на обновление списка, ngRepeat не отображает информацию.ngRepeat не обновляется, хотя список

В приведенном ниже коде добавляется массив $scope.selectedImages, когда изображения выбраны с использованием ввода файла. Он настроен так, что в список selectedImages будут добавлены только уникальные файлы (без дубликатов).

В конце функции scope.selectedImages печатает массив с новыми значениями, но в представлении ngRepeat не добавляет новые элементы списка с именами изображений.

Другие вопросы, касающиеся этой проблемы, говорят о том, что $scope.$apply должен решить проблему, но для меня это не так. Я использую это неправильно или есть что-то еще, что я недопонимаю.

EDIT: Просмотр 1 и View 2 в отдельных HTML-страниц, и опирающихся на том же контроллере.

Вид 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> 

Функция прокси позволяет md-button нажать ввод.

Вид 2:

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

Контроллер:

$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); 
    }); 
}; 
+0

У вас не было $ scope.uploadedImages в вашем контроллере! эта модель пуста! –

+0

@HanArantes Упс! Я скопировал более старую версию этого кода. Даже с помощью selectedImages возникает проблема, и ничего не отображается. Я редактировал новый код. –

ответ

0

Ваш входной шаблон поля и шаблон контроллера должны различных областей применения. Используйте $rootScope.selectedImages в вашем случае.

+0

Я попробовал это без везения, к счастью. –

+0

- поле ввода файла, помещенное внутри вашего шаблона контроллера? –

+0

Это может быть проблема на самом деле. У меня есть два html-файла, которые зависят от контроллера, один из них - боковая панель для загрузки, которая содержит вход, а другая - представление, которое должно отображать файлы. Есть ли способ сохранить это отдельно? –

Смежные вопросы