Angular.js文件上传未显示文件

时间:2019-04-08 11:32:27

标签: angularjs

我在显示我的双向数据绑定文本框数据时上传了带有一些文本框数据的图像,但是为什么我无法看到文件数据

HTML代码   

   <div class="form-group">
        <label for="name">Full Name</label>
        <input type="text" class="form-control" id="name" placeholder="Enter name" ng-model="customer.name">
    </div>

    <div class="form-group">
        <label for="name">Full Name</label>
        <input type="text" class="form-control" id="name" placeholder="Enter LastName" ng-model="customer.LName">
    </div>
    <div class="form-group">
        <label for="email">Email address</label>
        <input type="text" class="form-control" id="email" placeholder="Enter email" ng-model="customer.Mail">
    </div>
    <div class="form-group">
        <label for="exampleInputFile">Avatar</label>
        <input type="file" id="exampleInputFile" file-model="customer.file">
    </div>
    <button type="submit" class="btn btn-default" ng-click="Submit()">Submit</button>
</form>
{{customer}}

 $scope.Submit = function () {
        debugger;
        var data = new FormData();
        console.log("customer", $scope.customer)


    _App.directive('fileModel', ['$parse', function ($parse) {
        debugger;
        return {
            restrict: 'A',
            link: function (scope, element, attrs) {
                var model = $parse(attrs.fileModel);
                var modelSetter = model.assign;
                element.bind('change', function () {
                    scope.$apply(function () {
                        modelSetter(scope, element[0].files[0]);
                    })
                })
            }
        }
    }])

enter image description here 我在这里显示了图像,请{{customer}}帮助我,为什么我无法获取文件数据

1 个答案:

答案 0 :(得分:0)

Hi @Afreen Ghouse don’t do that on submit call you calling directive, but it should also include try this instead of add directive before submit call and inject that directive in controller.