Question

我正在Angular 2中创建一个带有自动完成输入的表单。我想在此输入中获取自动完成服务的数据但是，当我运行它时，我收到此错误：

ERROR Error: Uncaught (in promise): Error: formGroup expects a FormGroup instance. Please pass one in.

app.ts

export class AppComponent {
       @Input('group') 
        public group: FormGroup; 
     formatList(data: any):string { 
            return `<span>${data["value"]}</span>`; 
        } 
        searchResult(search:string):Observable<any> { 
            return this.autoCompleteService.search(search); 
      } 

      sendInitiator(item) {
         ....
       }
    constructor(
        private http: Http,
        private autoCompleteService:AutoCompleteInitiatorService
      ) {
         this.searchResult = this.searchResult.bind(this); 
         this.autoCompleteService = autoCompleteService; 
      }
    }

app.component

 <form id="Form" class="form-horizontal" novalidate="novalidate">
      label for="name" class="col-sm-2 control-label">Name :</label>
                    <div class="col-sm-4" [formGroup]="group">
                        <div class="input-group-item">
                            <input class="input" 
                                auto-complete require 
                                formControlName="initiator" 
                                [source]="searchResult"  
                                (valueChanged)="sendInitiator($event)" 
                                name="initiator" 
                                auto-complete-placeholder="Select One" 
                                value-property-name="id" 
                                display-property-name="value" 
                                min-chars="2" [list-formatter]="formatList" /> 
                        </div> 
    <form>

任何帮助/指向我正确的方向都会很棒！谢谢！

Answer 1

您需要使用formBuilder启动表单，例如plunker

this.group = this.formBuilder.group({
 initiator: ''
})

错误：未捕获（在承诺中）：错误：formGroup需要一个FormGroup实例。请在

1 个答案: