Angular 升级到 16 后 - 错误 NG8004:未找到名称为“txtTranslate”的管道

After Angular upgrade to 16 - error NG8004: No pipe found with name 'txtTranslate'

提问人:Priya Ganesan 提问时间:11/15/2023 更新时间:11/15/2023 访问量:66

问:

我已将我的 Angular 应用程序从 Angular 15 更新到 16。 我用几个节点包遇到了很少的编译错误,我解决了它们。 即使在那之后,也会出现许多错误,如下所示 ng serve

 error NG8004: No pipe found with name 'txtTranslate'
error NG8002: Can't bind to 'src' since it isn't a known property of 'svg-icon'.
1. If 'svg-icon' is an Angular component and it has 'src' input, then verify that it is part of this module.
2. If 'svg-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

75           <svg-icon class="width100" src="{{'eca_phone' | imgTranslate}}" [class]="'icon-size-10 icon-color'" [applyClass]=true></svg-icon>

我有一个sharedModule和appModule,并在两者中导入了commonModule。 而这个自定义的txtTrsnalate管道也在两者中声明。

@NgModule({
    declarations: [...]
imports: [
        CommonModule,
        BrowserModule,
        HttpClientModule,
        CoreModule,
        SharedModule,
        FormsModule,
        ReactiveFormsModule,
        BrowserAnimationsModule,
        ToastyModule.forRoot(),
        AccordionModule.forRoot(),
        CollapseModule.forRoot(),
        ColorPickerModule,
        AngularMyDatePickerModule,
        AngularDraggableModule,
        NgDragDropModule.forRoot(),
        UiSwitchModule,
        NgIdleModule.forRoot(),
        ScrollingModule,
        MsiCommonModule,
        NgbModule,
        AngularSvgIconModule.forRoot(),
        TranslocoRootModule
]
schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
    bootstrap: [DockContainerComponent]
})
export class AppModule { }
import {TxtTranslatePipe} from './resource/txt-translate.pipe';
 @NgModule({
  imports: [
    CommonModule,
    BrowserAnimationsModule,
    FormsModule,
   ...
 ],
 schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
 declarations: [
    LoginModalComponent,
    TxtTranslatePipe,
    ...
],
  exports: [
    LoginModalComponent,
    TxtTranslatePipe,
    ...
],
})
export class SharedModule { }
angular-cli angular16 ng

评论


答:

0赞 PabloGTab 11/15/2023 #1

有时,问题的根本原因在于流程的上游。在编译阶段,单个组件的故障可能会级联,从而导致整个模块的故障。您可以检查 SharedModule 或 CommonModule 中的每个组件

评论

0赞 Priya Ganesan 11/16/2023
在AppModule中导入和声明的所有组件都会引发此错误。 .升级后会出现此问题,我添加了 @ngneat/transloco,其中也没有错误If 'app-videosContainer' is an Angular component, then verify that it is part of this module.