我应该在哪个模块中声明 Angular 指令？

穆罕默德·希拉里扎德

我有一个指令：

@Directive({
    selector: '[ICheck]',
})
export class ICheckDirective {

    @Input()
    ICheck: string;

    constructor(element: ElementRef) {
        var $element: any = $(element.nativeElement);

        $element.iCheck({
            checkboxClass: 'icheckbox_md',
            radioClass: 'iradio_md',
            increaseArea: '20%'
        })
    }

}

我在哪里声明它 app.module

@NgModule({
    declarations: [
        ...
        ICheckDirective,
    ],
    imports: [
        ...
    ],
    providers: [
        ...
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

我的组件RoleListComponent中出现错误roles.module

@NgModule({
    imports: [
        RoleListComponent,
        ...
    ],
    declarations: [
        ...
    ]
})
export class RolesModule { }

我得到的错误

错误错误：未捕获（承诺）：错误：模板解析错误：无法绑定到“ICheck”，因为它不是“输入”的已知属性。(" ][ICheck] />

我的路由：

const routes: Routes = [
    {
        path: '',
        children: [
            {
                path: '',
                component: DashboardComponent
            },
            {
                path: 'users',
                loadChildren: './user/user.module#UserModule'
            },
            {
                path: 'roles',
                loadChildren: './roles/roles.module#RolesModule'
            },
            {
                path: 'portalpageowners',
                loadChildren: './portalpageowner/portalpageowner.module#PortalPageOwnerModule'
            }
        ]
    }
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
})
export class AdminRoutingModule { }

苏伦·斯拉皮安

您需要添加到要在其中使用它的模块的声明中。在你的情况下进入RoleModule. 但是如果您需要将其添加到更多模块中，则需要创建一个SharedModule, 从中导出该指令

@NgModule({
   declarations: [ ..., ICheckDirective, ... ],
   exports: [ ..., ICheckDirective, ... ]
})
export class SharedModule { }

并将这个模块导入到另一个模块中。

@NgModule({
   imports: [ ..., SharedModule, ... ]
})
export class RoleModule { }

...

@NgModule({
   imports: [ ..., SharedModule, ... ]
})
export class AnotherModule { }

export将使指令对那些 import 的模块的声明可见SharedModule。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。