小编Dea*_*Dea的帖子

我正在使用Angular2处理应用程序.我试图在我的应用程序中使用Reactive Forms但我遇到了一些错误:

第一个错误是关于NgControl,如下所示:

没有NgControl的提供者("

div class ="col-md-8"[ERROR - >] input class ="form-control"id ="productNameId""):ProductEditComponent @ 16:24

第二个错误是关于ControlContainer,如下所示:

没有ControlContainer的提供者("div [ERROR - >] div formArrayName ="tags">

div class ="row">

按钮cl"):

Htmm文件如下:

 <div class="panel panel-primary">
   <div class="panel-heading">
      {{pageTitle}}
</div>

<div class="panel-body">
    <form class="form-horizontal"
          novalidate
          (ngSubmit)="saveProduct()"
          formGroup="productForm" >
        <fieldset>
            <div class="form-group" 
                 [ngClass]="{'has-error': displayMessage.productName }">
                <label class="col-md-2 control-label" for="productNameId">Product Name</label>

                <div class="col-md-8">
                    <input class="form-control" 
                            id="productNameId" 
                            type="text" 
                            placeholder="Name (required)" 
                            formControlName="productName" />
                    <span class="help-block" *ngIf="displayMessage.productName">
                            {{displayMessage.productName}}
                    </span>
                </div>
            </div>


 <div formArrayName="tags">
                <div class="row">
                    <button class="col-md-offset-1 col-md-1 btn btn-default" …

我的应用程序中有这部分代码

addComment (body: Object): Observable<Comment[]> {
    //let bodyString = JSON.stringify(body); // Stringify payload
    let bodyString = JSON.parse(JSON.stringify(body || null ))
    let headers = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON
    let options = new RequestOptions({ headers: headers }); // Create a request option

    return this.http.post(this.commentsUrl, bodyString, options) // ...using post request
                        .map((res:Response) => res.json()) // ...and calling .json() on the response to return data
                        .catch((error:any) => Observable.throw(error.json().error || 'Server error')); //...errors if any
}   

当我尝试在我的应用程序中添加评论时，它会引发如下错误： …

在我的Angular2应用程序中,文件夹的组织如下

 Project
 |
 +-- file 1
 |    
 +-- api //folder
 |   |  
 |   | +-- listOfProducts //folder
 |          |
            +-- products.json //file 
 +-- src //folder
 |  |  
 +  | +-- app //folder
          | +-- product //folder
                 +-- product.service.ts
                 +-- product-list.component.ts
                 +-- //other files

product.service.ts如下:

 import {Injectable} from '@angular/core';
 import {Http, Response} from '@angular/http';
 import {Observable} from 'rxjs/Observable';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/do';
 import 'rxjs/add/operator/catch';

 import {IProduct} from './product';


 @Injectable()

 export class ProductService{

private _productUrl = 'api/listOfProducts/products.json';
   // here 404 error

constructor(private …