Angular11忽略的指令

Question

我试图为numbers创建一个与reactive form兼容的组件。我的组件包含一个用于格式化数字数据的指令。

<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 { }

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

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

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

Answer 1

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