2016-10-25 19 views
11

Wciąż jestem na tym początku i uczę się przez samouczki, ale z jakiegoś powodu otrzymuję wiadomość No provider for formbuilder podczas próby przetestowania unikalnej nazwy użytkownika. Nie jestem pewien, dlaczego otrzymuję tę wiadomość, ale nie mogę znaleźć rozwiązania. Czy ktoś może mi powiedzieć, dlaczego tak się dzieje?Brak dostawcy dla FormBuilder

Rejestracja-component.ts

import {Component} from '@angular/core'; 
import {ControlGroup, Control, Validators, FormBuilder} from '@angular/common' 
import {UsernameValidators} from './usernameValidators' 

@Component({ 
selector: 'signup', 
templateUrl: 'signup-component.html' 

}) 
export class SignupComponent{ 
    form: ControlGroup; 

    constructor(fb: FormBuilder){ 
    this.form = fb.group({ 
     username:['', Validators.compose([ 
      Validators.required, UsernameValidators.cannotContainSpace 
     ])], 
     password: ['', Validators.required] 
    }) 
    } 
} 

usernameValidators.ts

import {Control} from '@angular/common' 


export class UsernameValidators{ 

    static shouldBeUnique(control: Control){ 
    return new Promise((resolve, reject) => { 
     setTimeout(function(){ 
     if(control.value == "andy") 
      resolve({shouldBeUnique: true}); 
     else 
      resolve(null); 
     }, 1000); 

    }); 

    } 


    static cannotContainSpace(control: Control){ 
    if (control.value.indexOf(' ') >= 0) 
     return {cannotContainSpace: true}; 

    return null; 
    } 
} 

Odpowiedz

27

importu ReactiveFormsModule i FormsModule

@NgModule({ 
    imports: [ 
     BrowserModule /* or CommonModule */, 
     FormsModule, ReactiveFormsModule 
    ], 
    ... 
}) 

w module gdzie używasz FormBuilder

+2

Dzięki! zadziałało, zaimportowałem ReactiveFormsModule w app.module.ts, ponieważ tego brakowało – sabin

+0

ReactiveFormsmodule i FormsModule nie powinny być importowane razem w tym samym module – DAG

+0

@dag Dlaczego? '6 więcej do zrobienia ...' – tom10271

Powiązane problemy