(change) vs [(ngModel)] 输入类型文件在 Angular
(change) vs [(ngModel)] with input type file in Angular
我是 Angular 的新手，对 (change) 事件和 (ngModel) 感到困惑。它们都用于跟踪表单的状态吗？我可以将 ngModel 用作（更改）还是哪个更好？问题是当我有一个输入类型="file" 的表单时。
当我使用 (ngModel) <input type="file" [(ngModel)]="link" name="link"/> 并通过 this.link 获取值时。在后端，它 returns 一个空对象 {}。
但是当我使用（更改）<input type="file" name="link" (change)="fileUploadChange($event)"/> 并使用函数
获取文件时
fileUploadChange(event){
this.link = event.target.files[0];
}
在后端，returns我想要的文件路径。 {link: {路径: "C://..." }}
那么我可以使用 (ngModel) 以任何方式输入 type="file" 吗？
为了回答您关于哪个更好的问题，多年来 Angular 的趋势是远离 ngModel 和双向绑定（目前使用 ngModel 完成）。我记得听说双向绑定被 Angular 团队认为是一个错误，在 AngularJS 中本不应该存在。这是 AngularJS 中属性的默认行为，一旦 Angular 2 出现，它只能通过 ngModel 实现。总之，您使用（更改）的方法比 ngModel 更好，并且更符合当前推荐的方法。
[(ngModel)] 与（更改）：
[(ngModel)]:
我们需要在要使用 ngModel 的模块中导入 formsModule。
ngModel 用于方式绑定。它会继续跟踪您的每个输入。
根据 angular.
(变化):
On change 事件仅在值从其先前状态发生变化时调用。在更改事件中，我们需要传递事件并需要从事件中获取值。 event.target.value.
[(ngModel)] 和（更改）事件，输入类型 = "file" .
如果我们将 ngModel 与文件输入一起使用，我们只会得到假路径，比如。 C:\fakepath\Screenshot 从 2019-12-13 15-03-17.png
如果我们将它与更改事件一起使用：
html
<input type="file" (change)="uploadFile($event)">
ts
uploadFile(event){
this.file1 = event.target.value;
this.file2 = event.target.files[0];
console.log(this.file1) // in this case we only get fakepath same as we get in ngModel.
console.table(this.file2) // in this case we get object with data like, name, lastModified, lastModifiedDate, size and type.
}
我个人认为更改事件更适合与输入类型文件一起使用。
我是 Angular 的新手，对 (change) 事件和 (ngModel) 感到困惑。它们都用于跟踪表单的状态吗？我可以将 ngModel 用作（更改）还是哪个更好？问题是当我有一个输入类型="file" 的表单时。
当我使用 (ngModel) <input type="file" [(ngModel)]="link" name="link"/> 并通过 this.link 获取值时。在后端，它 returns 一个空对象 {}。
但是当我使用（更改）<input type="file" name="link" (change)="fileUploadChange($event)"/> 并使用函数
fileUploadChange(event){
this.link = event.target.files[0];
}
在后端，returns我想要的文件路径。 {link: {路径: "C://..." }}
那么我可以使用 (ngModel) 以任何方式输入 type="file" 吗？
为了回答您关于哪个更好的问题，多年来 Angular 的趋势是远离 ngModel 和双向绑定（目前使用 ngModel 完成）。我记得听说双向绑定被 Angular 团队认为是一个错误，在 AngularJS 中本不应该存在。这是 AngularJS 中属性的默认行为，一旦 Angular 2 出现，它只能通过 ngModel 实现。总之，您使用（更改）的方法比 ngModel 更好，并且更符合当前推荐的方法。
[(ngModel)] 与（更改）：
[(ngModel)]:
我们需要在要使用 ngModel 的模块中导入 formsModule。 ngModel 用于方式绑定。它会继续跟踪您的每个输入。 根据 angular.
，ngModel 不是 formControlName 也不是 formControl
(变化):
On change 事件仅在值从其先前状态发生变化时调用。在更改事件中，我们需要传递事件并需要从事件中获取值。
event.target.value.[(ngModel)] 和（更改）事件，输入类型 = "file" .
如果我们将 ngModel 与文件输入一起使用，我们只会得到假路径，比如。 C:\fakepath\Screenshot 从 2019-12-13 15-03-17.png
如果我们将它与更改事件一起使用：
html
<input type="file" (change)="uploadFile($event)">ts
uploadFile(event){ this.file1 = event.target.value; this.file2 = event.target.files[0]; console.log(this.file1) // in this case we only get fakepath same as we get in ngModel. console.table(this.file2) // in this case we get object with data like, name, lastModified, lastModifiedDate, size and type. }我个人认为更改事件更适合与输入类型文件一起使用。