代码之家 › 专栏 › 技术社区 › Devmix

检查磁场何时以角度接触?

typescript angular

-1

Devmix · 技术社区 · 7 年前

我一直在做一些研究,但仍然找不到我要找的东西。我有一个表格,想捕捉感动的事件。我的代码如下所示:

this.form.valueChanges.subscribe(res =>{
  if(res !== null){
    console.log('message');
  }
})

如果要输入一个值,我可以将该值调出控制台,但我希望在触摸字段时能够显示类似“field has been toucted”的消息。

5 回复 | 直到 7 年前

1

Stephen R. Smith 7 年前

当用户单击字段、输入值、按enter键或退出字段时,可以使用输入事件调用函数,具体取决于您想要的内容。

<input #textfield 
(keyup.enter)="onEnter(textfield.value)" 
(blur)="onBlur(textfield.value)"
>

onEnter(value) {
console.log("User entered this: ",value);
}

onBlur(value) {
console.log("User existed field: ",value);
}

2

0

Shashan Sooriyahetti 7 年前

@Component({
  selector: 'my-custom-form-component',
  templateUrl: './custom-form-component.html',
  providers: [{
    provide: NG_VALUE_ACCESSOR,
    useExisting: MyCustomFormComponent,
    multi: true
  }]
})
export class MyCustomFormComponent implements ControlValueAccessor, DoCheck {

  private control: AbstractControl;

  private pristine = true;


  ngDoCheck (): void {
    if (this.pristine !== this.control.pristine) {
      this.pristine = this.control.pristine;
      if (this.pristine) {
        console.log('Marked as pristine!');
      }
    }
  }

}

这就是我发现的。这也适用于触摸。

3

-1

Buczkowski 7 年前

如果您正在使用 ReactiveForms 检查文档:

https://angular.io/api/forms/AbstractControl

它有一些属性,可以用来确定输入是否 touched

4

-1

Noel R. 7 年前

您可能想看看ng-touched CSS类,并尝试使用它。您可以将其与表单引用结合使用,在表单引用中可以检查表单状态。我记得用它进行表单验证。这可能不是你想要做的,但它可能会为你指明正确的方向。

在我的CSS中:

input.ng-invalid.ng-touched {
  border: 1px solid red;
}