导入角文件时单击“后退”按钮
相当新的角度和弹簧引导。我正在尝试开发一个导入函数，并开发了一个文本文件解析器。我有三个按钮:导入，上传和后退按钮。
单击Import按钮时，它将从本地导入文本文件。它将转到importFileChecker()以检查它是否是一个有效的txt文件，然后继续到文本文件解析器函数(我已经命名为openFile())。单击“上载”时，其端点将将文本文件内容保存到数据库中。然后，当单击Back，它将返回到主页，并允许您再次上传。
我的上传和导入都很好。但是，我的问题是，每当我单击上一次，它就不会继续到我的importFileChecker()，就像在core.js等文件中的连续循环一样，当我通过浏览器断点时。
我添加了控制台日志来监视流程。对于我的错误，任何帮助都将不胜感激。
场景:单击Import然后选择一个文件(正常和正确的流，这是上传之后)
onBtnImportClick starting (line 181)
reached end of line onBtnImportClick (line 195)
importFileChecker is starting (line 202)
process for txt file starting. (line 720)场景:单击“导入”->选择了一个文件->单击了回->单击了“再次导入”->再次选择了一个文件
onBtnImportClick starting (line 181)
reached end of line onBtnImportClick (line 195)什么都没发生。放置断点并暂停，它会停止在core.js之类的地方
这些是我的html和.ts：
upload-file-test.html
- 我的导入按钮html：
<div class="col-md-2">
<input class="side-buttons" type="button" value="{{ 'Import' }}"
(click)="onBtnImportClick($event)">
<input class="hide-style" id="importData" type="file" (change)="importFileChecker($event)" />
</div>upload-file-test.component.ts:
- onBtnImportClick
public onBtnImportClick(event: any) {
console.log('onBtnImportClick starting');
event.preventDefault();
event.stopPropagation();
//some additional code for getting data
document.getElementById("importData").click();
console.log('reached end of line onBtnImportClick');
}- importFileChecker
public importFileChecker(event: any){
event.preventDefault();
event.stopPropagation();
console.log('importFileChecker is starting')
this.testFileName = event.target.files[0].name;
var fileName = event.target.files[0].name;
if(fileName.includes('.txt')){
this.openFile(event);
this.enableUploadButton = true;
} else {
//some error popup here
}
this.blocked=false;
}- 背
back(){
this.goToUploadPage = false;
this.testFileName = '';
}回答 1
Stack Overflow用户
发布于 2022-01-31 00:55:05
importFileChecker()方法是由更改事件触发的，如果您多次选择同一个文件，则不会调用它。此文件存储在输入元素中。必须清除back()方法中的输入元素。一种可能的方法是使用模板参考变量。
Html：
...
<input #inputRef class="hide-style" id="importData" type="file" (change)="importFileChecker($event)" />
...构成部分：
...
@ViewChild("inputRef") inputRef: ElementRef;
...
back() {
this.goToUploadPage = false;
this.testFileName = "";
this.inputRef.nativeElement.value = "";
}https://stackoverflow.com/questions/70915099
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号