Question

-app
 - app.module.ts
 - app.component.ts
 - +home
    - home.module.ts 
    - home.component.ts
    - home.component.html
    - utils
        - page-header-component
    - reports
         - reports.module.ts
         - report.routing.ts
         - components
            - waybill-sign-off
 - +<other "features">
  - shared
  - shared.module.ts

然后我在home模块和reports模块中使用了pager-header-component，但是出现了这个错误。

无法绑定到“标题”，因为它不是“ page-header-component”的已知属性。

这是我的页面标题组件：

export class PageHeaderComponent {
@Input() loading: boolean;
@Input() heading: string;
@Input() showSearch: boolean = true;
@Input() showPageSize: boolean = true;
@Input() showFilter: boolean = false;
@Input() showFilterIcon: boolean = false;
@Input() filterData: Array<FilterData>;

@Input() showDate: boolean = false;
@Input() showDD: boolean = false;
@Input() DDData: Array<any> = [];

这是html：

<page-header-component [heading]="
   ('ADMIN.HEADER.WAYBILL_SIGNOFF'|translate)" 
   [showPageSize]="config.totalItems>10" [showDate]="true"
   [showSearch]="true" (searchChanged)="searchBy($event)" 
   (pageSizeChanged)="selectPagesize($event)" 
   (dateField)="onDateChange($event)">

我在HomeModule和ReportModule中都使用PageHeaderComponent 但仍然收到错误不知道为什么？

这是我的Home模块ts

    declarations: [
           .
           .
    WayBillDetailComponent,
    PageHeaderComponent,
    ]

是否需要导出PageHeaderComponent？这个问题不仅会出现在页面标题组件上，还会出现在其他组件上。我想最近几天我找不到模块的结构问题，谁能帮上忙。感谢进阶。

Answer 1

如果要绑定自定义元素，则需要在CUSTOM_ELEMENTS_SCHEMA中指定module，例如：

import { NgModule,CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@NgModule({
    ...Other Properties
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})

Answer 2

您还需要在括号中定义名称，如下所示：

@Input('loading) loading: boolean;
@Input('heading') heading: string;
@Input('showSearch') showSearch: boolean = true;
@Input('showPageSize') showPageSize: boolean = true;
@Input('showFilter') showFilter: boolean = false;
@Input('showFilterIcon) showFilterIcon: boolean = false;
@Input('filterData') filterData: Array<FilterData>;
@Input('showDate') showDate: boolean = false;
@Input('showDD') showDD: boolean = false;
@Input('DDData') DDData: Array<any> = [];

无法绑定到“标题”，因为它不是“ page-header-component”的已知属性

2 个答案: