"Cannot read property 'length' of undefined" Error about angular-material-fileinput HOT 11 OPEN

Another issue with this code is that, I want to save file info ($scope.files) to another $scope to use it later. But it doesn't work.
What Should i do?

from angular-material-fileinput.

Hi ! the first problem maybe is related to angular version , i will check it as soon as i can.
and the second problem you should use copy or reference to per file.

var filesTmp = angular.copy($scope.files);
var fileTmp = $scope.files[0];

from angular-material-fileinput.

Hi, Thanks for your reply. I will check it.
Thanks again.

from angular-material-fileinput.

It didn't work, too.
here is my code:

$scope.filesTmp = {};

        // Upload
        $scope.$watch('files.length', function(newVal, oldVal) {
            console.log($scope.files);
            $scope.myCroppedImage='';
            $scope.fileURLAddress='';
            $scope.isNull = true;
            $scope.avatarEditing = false;
            $scope.avatarCropped = false;
            // $scope.filenameVar = $scope.files[0].lfFileName;
            $scope.filesTmp = angular.copy($scope.files);
            if($scope.files.length != 0){
                $scope.fileURLAddress = $scope.files[0].lfDataUrl;
                $scope.isNull = false;
                $scope.avatarEditing = true;
            } else {
                $scope.fileURLAddress = null;
            }
        });
        console.log("Start Outside");
        console.log($scope.filesTmp);

I need upload file info save in $scope.filesTmp and I use it outside of $scope.$watch.

from angular-material-fileinput.

Have you checked about first problem?

from angular-material-fileinput.

Hi ~ can your provide some code about html ?

from angular-material-fileinput.

Hi.

<md-input-container class="[ md-block md-input--grey md-has-icon--fix ]">
    <lf-ng-md-file-input 
           class="[ mv0 ]" 
           lf-files="files"
           accept="image/*" 
           progress>
    </lf-ng-md-file-input>
</md-input-container>

from angular-material-fileinput.

@shuyu Hi ~ did you check the codes?

from angular-material-fileinput.

Hey @hamidyfine, found a possible solution for you since I had exactly the same problem.

If you have your controller defined thusly:

var myModule = angular.module('someModule', []);

Then you'd like to change it to

var myModule = angular.module('someModule', ['lfNgMdFileInput']);

I am using states in my app so I have several sub-modules like this. In short, the library seems to have scope issues. In length, I have no idea why this solves the problem, but someone better than me at scope management could help.

from angular-material-fileinput.

I have a similar issue. My problem was use ng-if.

<div flex="100" layout="row" layout-align="start center" ng-if="data.showFileList">
          <lf-ng-md-file-input lf-files='files' multiple lf-browse-label="Buscar Archivo"
                              lf-placeholder="Seleccionar Archivos">
          </lf-ng-md-file-input>                    
  </div>

When the view is created, ng-if dont render that block of the DOM, so, $scope.files was never available and always 'undefined'.

Changing for a ng-show make it work

<div flex="100" layout="row" layout-align="start center" ng-show="data.showFileList">
          <lf-ng-md-file-input lf-files='files' multiple lf-browse-label="Buscar Archivo"
                              lf-placeholder="Seleccionar Archivos">
          </lf-ng-md-file-input>                    
  </div>

from angular-material-fileinput.

You need to initialize the object as an array. You're trying to watch for .length on an object that isn't an array when you setup the watch (because it's still null or undefined, not having been used).

Since you're binding to $scope.files declaratively, just set $scope.files = [] in your controller so it's get's initialized and do that before trying to setup the watch.

from angular-material-fileinput.