我有一个表单,其中一个字段充当自动完成.如果用户输入单词并按Enter键,则该字段的内容应添加到该字段下方的列表中.
问题:当用户点击进入时,自然会提交整个表单.
我已经return false处理了处理按键的功能.但是,即使在调用此函数之前,表单似乎也已提交.
我该如何防止这种情况发生?
基本形式:
<div id="profileForm">
<form [formGroup]="profileForm" (ngSubmit)="onSubmit()" method="post" *ngIf="!showSuccessMessage">
<div class="row">
<div class="form-group col-xs-12 col-sm-6">
<label for="first_name">My Skills</label>
<div class="autocomplete">
<input formControlName="skill_string" [(ngModel)]="skillString" name="skill_string"
type="text" class="form-control" id="skill_string" placeholder="Comma separated" (keyup.enter)="skillsHandleEnter(skillString)">
<ul class="autocomplete-list" *ngIf="skillHints.length > 0">
<li class="list-item" *ngFor="let skill of skillHints" (click)="addSkillFromAutocomplete(skill)">{{skill}}</li>
</ul>
</div>
<div id="skill-cloud" class="tag-cloud">
<span class="skill-tag tag label label-success" *ngFor="let skill of selectedSkills" (click)="removeSkill(skill)">{{skill}} x</span>
</div>
</div>
</div>
<div class="row">
<hr>
<div class="form-group submit-group">
<div class="col-sm-12">
<button type="submit" class="btn btn-primary pull-right" …Run Code Online (Sandbox Code Playgroud)