Question

我正在创建一个文件上传指令，用于表单。

angular.module("app")
    .directive("myFileUpload", [function () {
        return {
            restrict: "E",
            template: '<input type="file" multiple class="form-control" placeholder="Select file">',
            scope: {
                files: "="
            },
            link: function (scope, element) {

                element.change(function (event) {
                    scope.files = event.target.files;
                    event.preventDefault();
                });

            }
        }
    }]);

我可以在我的应用程序的某个地方使用此指令。

<div class="col-sm-9">
    <input ng-model="myform.title">
    <my-file-upload files="myform.files"></my-file-upload>
</div>

我想列出所选的文件：

<div class="col-sm-9">
    <input ng-model="myform.title">
    <my-file-upload files="myform.files"></my-file-upload>
    <p ng-repeat="item in myform.files">{{item.filename}}</p>
</div>

如果我没有在输入myform.title中输入文字，则文件不会列出。

Answer 1

回调

element.change

发生在＆＃34; angular-world＆＃34;之外。你需要让角度知道＆＃34;发生了什么事情＆＃34; 试试这个

 element.change(function (event) {
                scope.files = event.target.files;
                event.preventDefault();
                scope.$apply();
            });

Angularjs文件上传指令

1 个答案: