file-upload – Angular 2从输入类型=文件上传文件

发布时间：2020-12-17 08:28:59 所属栏目：安全来源：网络整理

导读：使用角度2 beta，我似乎不能得到类型文件的输入工作。使用诊断我可以看到其他类型的文本的双向绑定。 form {{diagnostic}} div class="form-group" label for="fileupload"Upload/label input type="file" class="form-control" [(ngModel)]="model.fileupl

使用角度2 beta，我似乎不能得到类型文件的输入工作。

使用诊断我可以看到其他类型的文本的双向绑定。

<form>
    {{diagnostic}}
    <div class="form-group">
        <label for="fileupload">Upload</label>
        <input type="file" class="form-control" [(ngModel)]="model.fileupload">
    </div>
</form>

在我的typescript文件我有诊断线可用：

get diagnostic() { return JSON.stringify(this.model); }

难道这是不是JSON的问题？该值为null。

我不能真正验证输入的值;不知何故，即使“选择文件…”旁边的文本更新，我看不到DOM中的差异。

我认为它不被支持。如果你看看这个DefaultValueAccessor指令(见 https://github.com/angular/angular/blob/master/modules/angular2/src/common/forms/directives/default_value_accessor.ts#L23)。您将看到用于更新绑定元素的值是$ event.target.value。

这不适用于使用类型文件的输入的情况，因为文件对象可以到达$ event.srcElement.files。

更多细节，你可以看看这个plunkr：https://plnkr.co/edit/ozZqbxIorjQW15BrDFrg?p=info：

@Component({
  selector: 'my-app',template: `
    <div>
      <input type="file" (change)="onChange($event)"/>
    </div>
  `,providers: [ UploadService ]
})
export class AppComponent {
  onChange(event) {
    var files = event.srcElement.files;
    console.log(files);
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!