Question

我没有使用表单标记来包装输入，我想在提交点击中验证输入

我尝试使用FormControl，我没有想到停止提交值，它会被提交。

我试过的代码在

之下

<div class="dead-line">
<span class="p-gap">To delivery in this period I want to recevive orders until 
    <a (click)="deadlineTime(i)" class="del-r">
    <input type="date" class="form-control hide-dt"  [formControl]="deadlineVal" required>
    {{i.dead_line_time}}</a>
    </span>
    </div>
  <button class="bt-save" (click)="submitHomeDelivery()">Save</button>

.TS

  deadlineVal: FormControl = new FormControl('',
           [Validators.required]);

submitHomeDelivery() {

    var self = this;
    console.log('self.deadlineVal',  self.deadlineVal);
---------------------
---------------------

我怎么能阻止提交（强制输入添加），任何想法都会赞赏

Answer 1

通过标记函数并根据您的要求返回值（True / False）将禁用属性添加到按钮。

如果您使用的是Angular 1.x

，下面是示例

#inputFruit

Answer 2

只需检查这样的有效身份。

@ManyToOne(cascade = CascadeType.ALL)

Answer 3

只需添加一些返回True / False的函数，就像这样

  <button class="bt-save" (click)="submitHomeDelivery()" [disabled]='checkDisabled()'>Save</button>

checkDisabled() {
     return !this.deadlineVal.valid
}

如果您的条件与我建议的其他呼叫功能相同，您也可以将表达式添加到HTML中。

Answer 4

只需将[disabled]="!deadlineVal.valid"添加到按钮即可。

<button class="bt-save"
    (click)="submitHomeDelivery()"
    [disabled]="!deadlineVal.valid">Save</button>

Angular 2：使用FormControl

4 个答案: