Question

我在html中有这个：

             <input class="ui-g-4 right" name="unitprice" pattern="(0\.((0[1-9]{1})|([1-9]{1}([0-9]{1})?)))|(([1-9]+[0-9]*)(\.([0-9]{1,2}))?)" [(ngModel)]="product.unitprice" (focusout)="addDecimal(i)" (ngModelChange)="product.unitprice = $event;sumTotal(i)">

我想要的是检查焦点是否可以，如果不显示某些消息。有什么建议吗？

Answer 1

替换此

[(ngModel)]="product.unitprice"

有了这个

[formControl]="unitprice"

在您的TS中，创建此

unitprice: FormControl = new FormControl(this.product.unitprice, [
  Validators
    .pattern((0\.((0[1-9]{1})|([1-9]{1}([0-9]{1})?)))|(([1-9]+[0-9]*)(\.([0-9]{1,2}))?))
]);

现在您可以检查错误，并使用此

将类应用于您的输入

[class.has-error]="unitprice.hasError('pattern')"

或在你的TS

if (!this.unitprice.hasError('pattern')) { /* valid value */ }

Answer 2

替换此

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

  return this.userService.isLogedIn().do(response => {
    if (!response) {
      this.router.navigate(['/login'], {
        queryParams: {
          return: state.url // curent url as a parameter to the login page
        }
      });
    }
  })
}

有了这个

[(ngModel)]="product.unitprice"

在你的文件中：

[formControl]="price"

现在在你的html文件中：

private priceInput:FormControl;

ngAfterViewInit(){
    this.priceInput = new FormControl(null, {
       validators: Validators.pattern((0\.((0[1-9]{1})|([1-9]{1}([0-9]{1})?)))|(([1-9]+[0-9]*)(\.([0-9]{1,2}))?)),
       updateOn: 'blur'
    });
}

如何检查表单中的表单是否有效？

2 个答案: