在DOM中插入/删除组件

时间:2016-09-04 00:47:24

标签: angular

我尝试在自定义组件上使用HostBinding:

应用外形error.component.ts

import { Component } from '@angular/core';
import { FormGroup } from '@angular/forms';

@Component({
    moduleId: module.id,
    selector: 'app-form-error[form]',
    templateUrl: 'app-form-error.component.html',
    styleUrls: ['app-form-error.component.css'],
    host: {
        '[ngIf]': 'form.errors'
    },
    inputs: ['form']
})
export class AppFormErrorComponent {
    form: FormGroup;
}

应用-form.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { AppFormErrorComponent } from './app-form-error/app-form-error.component';

const APP_FORM_DIRECTIVES = [
    AppFormErrorComponent
];

@NgModule({
    imports: [
        BrowserModule,
        FormsModule,
        ReactiveFormsModule
    ],
    declarations: [
        APP_FORM_DIRECTIVES
    ],
    exports: [
        APP_FORM_DIRECTIVES
    ]
})
export class AppFormModule {

}

但我收到了以下错误:

  

无法绑定到' ngIf'因为它不是'app-form-error'的已知属性。

我该如何解决?

P.S。我使用的是Angular 2 RC6

[UPDATE]

好的,我现在明白HostBinding不是一个选项。但我仍然很好奇如何实现条件插入。

0 个答案:

没有答案