首页 > 解决方案 > 在Angular中的另一个组件上调用函数时出现问题

问题描述

在我在这里解释我的问题之前是我的设置的背景。

核心是 AG Grid 和ag-grid-angular组件。我在其上构建了一个ag-grid-base组件,它处理过滤器分页等基本功能。然后我有一个名为filter-grid的组件,它向网格添加一些动态设置内容,例如加载列列表等。然后我使用一个这个组件来设置我的不同网格的实例来显示数据。网格的一个功能是以模式形式查看和/或编辑数据。我实现了一个事件发射器,让调用对话框的组件知道何时因为更改而需要重新加载数据。

数据重新加载功能是我的 ag-grid-component 的一部分,我可以从我的 filter-grid 组件中很好地调用它但是当我尝试从我的自定义网格中调用 filter-grid 上的函数时,我得到了一堆错误,比如

BucketGridComponent_Host.ngfactory.js?[sm]:1 ERROR 错误:StaticInjectorError(AppModule)[BucketGridComponent -> FilterGridComponent]: StaticInjectorError(Platform: core)[BucketGridComponent -> FilterGridComponent]: NullInjectorError: 没有 FilterGridComponent 的提供者!

不知道我错过了什么..

标签: angular

解决方案


我认为这是重复的

也许您的 BucketGridModule 已经在导入时添加了app.module.ts
因此,您需要将 import 和 export(both) FilterGridModule 添加到BucketGridModule.component.ts 但是您FilterGridComponent没有模块,您需要declarations将该组件添加()到BucketGridModule. 如下。

BucketGridModule.component.ts

import { FilterGridComponent} from './{I don't know where it is}/FilterGridComponent';

@NgModule({
    imports: [
        ...
        FilterGridComponent
    ],
    export:  [
       ...
       FilterGridComponent
    ],
    declarations: [
        FilterGridComponent
    ],
})

app.component.ts

import { BucketGridModule} from './{I don't know where it is}/BucketGridModule';

@NgModule({
    imports: [
        ...
        BucketGridModule
    ],    
    declarations: [
        FilterGridComponent  //Now I'm not sure need or not.
    ],
})

推荐阅读