При загрузке изображения профиля в angularjs возникают проблемы с использованием модуля ng-file-upload для angularjs

При получении профиля из базы данных отображается изображение

После того, как я выбираю файл при обновлении, он не показывает изображение, а обновляет изображение

Загрузка файла с помощью angularjs: выше HTML-код: updateProfile.html

          <form name="userForm" method="post" ng-submit="create(user)" novalidate enctype="multipart/form-data">
           <div class="form-group">
            <label>Upload Profile</label>
            <input type="file" ngf-select ng-model="user.photo" name="file" ngf-pattern="'image/*'" ngf-accept="'image/*'" ngf-max-size="20MB" ngf-change="fileSelected($files, $event)"
             ngf-min-height="100" ngf-resize="{width: 100, height: 100}" onchange="angular.element(this).scope().fileChanged(event)"> 
          </div>
          <div ng-if="user.photo=== ''">
            <img  ng-src="{{imgSrc}}" src="{{imgSrc}}" width="200px" height="200px" alt="your image" />
             <a ng-click="remove()" class="glyphicon glyphicon-remove"></a>
          </div>
          <div ng-if="user.photo">
              <img ng-src="{{baseUrl}}/assets/admin/profiles/{{user.photo}}" src="{{baseUrl}}/assets/admin/profiles/{{user.photo}}" width="200px" height="200px" alt="your image" />
             <a ng-click="removeUpdate()" class="glyphicon glyphicon-remove" ng-show="user.photo"></a>
          </div>

И код контроллера для загрузки обновляемого изображения и добавлен раздел для удаления и изменения файла, но при изменении файла он не будет отображать текущее значение эскиза изображения: updateProfileCtrl.js

                   $scope.imgSrc=configService.baseUrl+'/assets/images/default_user.jpg';

                  $scope.fileChanged = function(e) {

                  var files = e.target.files;

                  var fileReader = new FileReader();
                  fileReader.readAsDataURL(files[0]);

                  fileReader.onload = function(e) {
                    $scope.imgSrc = this.result;
                    $scope.$apply();
                  };

                  };  
                $scope.remove = function(){
                    delete $scope.user.photo;
                    $scope.src = configService.baseUrl+'/assets/images/default_user.jpg';
                    delete $scope.srcUrl;
                    $scope.imgSrc = configService.baseUrl+'/assets/images/default_user.jpg';

                }

                $scope.removeUpdate = function(){
                    delete $scope.user.photo;
                    $scope.src = configService.baseUrl+'/assets/images/default_user.jpg';
                    delete $scope.srcUrl;
                    $scope.imgSrc = configService.baseUrl+'/assets/images/default_user.jpg';

                }

person Prachi Varaiya    schedule 11.08.2016    source источник
comment
Используйте formData для загрузки изображения с помощью angularjs. Здесь — образец, который я использовал.   -  person Ghazanfar Khan    schedule 11.08.2016