Making a switch statement on my partials angularjs

Question

I'm having a problem, i'm unable to get my ng-switch to work on my partials. What I'm trying to do is upload an image but before I upload it I must first check if the included image size doesn't reach 25kb.

Here is my controller code:

$scope.validateAvatar = function(files) {
    var fd = new FormData();
    $scope.filesize = files[0].size;
    $scope.filemaxsize = 25;
//Take the first selected file
fd.append("file", files[0]);

    $scope.uploadAvatar = function() {
        Api.uploadAvatar($scope.main.user.email, fd)
        .then(function(result) {
            console.log(result.data);
        }, function(result) {
            console.log(result);
        })
    };
};

and my partials code:

<form data-ng-submit="uploadAvatar()">
    <input type="file" name="file" onchange="angular.element(this).scope().validateAvatar(this.files)"/>

    <div ng-switch on="filesize / 1024 < filemaxsize">
        <div ng-switch-when="true">
            <input type="submit" value="Upload Avatar">
        </div>
        <div ng-switch-default>
            Please choose you avatar.
        </div>
    </div>

</form>

Also do you think my validation is enough when checking for the image file size, say what if the image included is size:20MB, will my validation still catch it? Sorry in the first place I haven't been able to make it work the switch statements first . :(

Answer 1

You need to call $scope.$apply() after you changed $scope.filesize manually.

BTW, why not just let $scope.filemaxsize = 25 * 1024;