无法绑定到'control'，因为它不是'error-messages'的已知属性

Question

我有这个angular2组件：

export class CountryDetailsComponent extends LoadingPage implements OnInit {
  countryName: string;
  productionForm: FormGroup;

..
}

和

@Component({
  selector: 'error-messages',
  template: `<div style="color:#E82C0C; margin: 6px 0;" *ngIf="errorMessage !== null">{{errorMessage}}</div>`
})
export class ErrorMessagesComponent {
  @Input() control: FormControl;
  constructor() { }

和模板：

              <div class="col-lg-10 ">
                <input class="price-format form-control" type="text"
                       [formControl]="productionForm.controls.priceFormat"
                       [(ngModel)]="productionConfig.priceFormat"
                       id="inputPriceFormat"
                       name="priceFormat">
                <error-messages [control]="productionForm.controls.priceFormat"></error-messages>
              </div>

但是我收到了这个错误：

Can't bind to 'control' since it isn't a known property of 'error-messages'.
1. If 'error-messages' is an Angular component and it has 'control' input, then verify that it is part of this module.
2. If 'error-messages' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
 ("nputPriceFormat"
                           name="priceFormat">
                    <error-messages [ERROR ->][control]="productionForm.controls.priceFormat"></error-messages>
                  </div>
          "): b@43:36

我该如何解决这个问题？