Angular11 忽略指令

Question

我试图为数字创建一个反应形式兼容的组件。 我的组件包含一个用于格式化数字数据的指令。

<form [formGroup]="parentForm">
    <div class="field">
        <span class="field-label" [innerHtml]="label"></span>
        <div class="input-group">
            <ng-content></ng-content>
            <input class="k-textbox" currencyTransform [formControlName]="fieldName" />
        </div>
    </div>
</form>

currencyTransorm是我的指令，它是这样声明的：

@Directive({
    selector: "[currencyTransform]"
})
export class CurrencyTransformDirective implements OnDestroy {
    ...
}

现在我有一些不同的模块。 一个导出所有组件的模块（在这种情况下只有NumeriFieldComponent ）：

@NgModule({
    imports: [
        CommonModule,
        ReactiveFormsModule
    ],
    declarations: [
        NumericFieldComponent
    ],
    exports: [
        NumericFieldComponent
    ]
})
export class ComponentsModule { }

我的测试页面的一个模块：

let routes: Routes = [
    { path: "", component: TestComponent }
];

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

@NgModule({
    imports: [
        CommonModule,
        ComponentsModule,
        ReactiveFormsModule,
        TestRoutingModule,
    ],
    declarations: [
        TestComponent
    ]
})
export class TestModule { }

最后一个模块是app.module.ts我在其中声明CurrencyTransformDirective ：

@NgModule({
    declarations: [
        AppComponent,
        CurrencyTransformDirective
    ],
    imports: [
        // SOME IMPORTS
        AppRoutingModule,
        BrowserAnimationsModule,
        BrowserModule,
        CommonModule
    ],
    providers: [
        // SOME PROVIDERS
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

看起来一切正常，但我的指令被忽略了。 我在构造函数中尝试使用console.log ，但没有写入浏览器控制台。 我究竟做错了什么？

Answer 1

一个可能的解决方案是为指令创建一个新模块。 我在ComponentsModule上导入了新模块，现在它工作正常。