angular2異步驗證this.subscribe異常？

我嘗試實現用戶名字段的異步（isUnique）和同步（cannotContainSpace）驗證功能，我想看到「這個用戶名已經在使用alert msg，如果textbox的值是」yener「同步功能工作正常，但我認爲ss下面可以幫助解釋了我的問題;angular2異步驗證this.subscribe異常？

注：canNotContain同步驗證FUNC工作正常，aafter我加isUnique設置異步功能此異常發生..

我該如何解決

？ usernamevalidator.ts

個

import {FormControl} from '@angular/forms'; 

export class UsernameValidator{ 
    static isUnique(control:FormControl){ 
     return new Promise((resolve, reject)=>{ 
      setTimeout(function(){ 
       debugger 
       if(control.value =="yener") 
        resolve({isUnique:true}) 
       else 
        resolve(null) 
      },1000); 
     });   
    } 
    static cannotContainSpace(control:FormControl){ 
     if(control.value.indexOf(' ')>=0) 
      return { cannotContainSpace:true }; 
     return null; 
    } 
}

postmessage.component.ts

import { Component } from '@angular/core'; 
import {FormControl,FormGroup,FormBuilder,Validators} from '@angular/forms'; 
import {UsernameValidator} from '../../validators/usernamevalidator'; 

@Component({ 
    moduleId:module.id, 
    selector: 'post-message', 
    templateUrl: '../../templates/postmessage.component.html' 
}) 
export class PostComponent { 
    form : FormGroup; 
    constructor(fb:FormBuilder){ 
     this.form = fb.group({ 
      username:['', Validators.compose([Validators.required, UsernameValidator.cannotContainSpace]),Validators.compose([UsernameValidator.isUnique])],    
      email:['', Validators.required],   
      message:['', Validators.required]   
     }); 
    } 
    signup(){ 
     console.log(this.form.value); 
    } 
}

這裏是HTML模板：

<form class="from-horizontal" [formGroup]="form" (ngSubmit)="signup()"> 
     <div class="form-group row"> 
      <label for="username" class="control-label col-md-2">Name:</label> 
      <div class="col-md-6"> 
       <input type="text" id="username" class="form-control" formControlName="username"> 
       <div *ngIf="form.controls['username'].touched && form.controls['username'].errors"> 
       <div class="alert alert-danger" 
       *ngIf="form.controls['username'].errors.required"> 
        User name is required. 
       </div> 
       <div class="alert alert-danger" 
       *ngIf="form.controls['username'].errors.cannotContainSpace"> 
        User name can not contain space 
       </div> 
       <div class="alert alert-danger" *ngIf="form.controls['username'].errors.isUnique"> 
        This user name already in use. 
       </div> 
       </div> 
      </div>...

來源

2016-11-24 TyForHelpDude

真奇怪，我以爲我們可以在表單生成器使用「Validators.compose（）」函數初始值設定爲async參數，但angular2不同意我的意見。我剛剛更改;

用戶名：[ ''，Validators.compose（[Validators.required， UsernameValidator.cannotContainSpace]），Validators.compose（[UsernameValidator.isUnique]）]，

到

用戶名：[ ''，Validators.compose（[Validators.required， UsernameValidator.cannotContainSpace]），UsernameValidator.isUnique]，

和它的作品

編輯：我也想通了，如果你想在一個組件使用

Validators.composeAsync（）

功能使用多個異步驗證。

來源

2016-11-24 10:54:32 TyForHelpDude

angular2異步驗證this.subscribe異常？

回答

相關問題