库中的默认角度管道不起作用

问题描述 投票:1回答:1

我正在构建一个Angular库以用于更大的项目。这将是一种多存储库方法,该应用程序的每个部分都是一个库。所有这些部分都将具有其组件,管道,服务...

但是我的第一个测试不起作用。我创建了独立的库和一个hello-world组件,并使用--watch进行了构建,并通过NPM将其链接到我的基础项目中……并且可以正常工作。它在屏幕上显示该消息。当我尝试添加任何种类的管道(即使默认管道中断)时,都会出现问题。如果创建日期对象并在消息后使用日期管道,则它将中断。与货币或异步管道相同。

日期管道错误:

Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[DatePipe -> InjectionToken LocaleId]: 
  StaticInjectorError(Platform: core)[DatePipe -> InjectionToken LocaleId]: 
    NullInjectorError: No provider for InjectionToken LocaleId!
Error: StaticInjectorError(AppModule)[DatePipe -> InjectionToken LocaleId]: 
  StaticInjectorError(Platform: core)[DatePipe -> InjectionToken LocaleId]: 
    NullInjectorError: No provider for InjectionToken LocaleId!
...

异步管道错误:

Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[AsyncPipe -> ChangeDetectorRef]: 
  StaticInjectorError(Platform: core)[AsyncPipe -> ChangeDetectorRef]: 
    NullInjectorError: No provider for ChangeDetectorRef!
Error: StaticInjectorError(AppModule)[AsyncPipe -> ChangeDetectorRef]: 
  StaticInjectorError(Platform: core)[AsyncPipe -> ChangeDetectorRef]: 
    NullInjectorError: No provider for ChangeDetectorRef!
    at NullInjector.push.../../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:8896)
...

库模块看起来像这样:

@NgModule({
  declarations: [HolaMundoTestComponent],
  imports: [
    CommonModule
  ],
  exports: [HolaMundoTestComponent]
})
export class HolaMundoTestModule { }

及其导出的组件:

@Component({
  selector: 'lib-hola-mundo-test',
  // templateUrl: './hola-mundo-test.component.html',
  // template: `<h1>Hola mundo en fecha {{ dateFrom | date }}</h1>`,
  template: `<h1>Hola mundo en fecha {{ text | async }}</h1>`,
  styleUrls: ['./hola-mundo-test.component.scss']
})
export class HolaMundoTestComponent {
  public text = new BehaviorSubject<string>('MITEXTO');
  public dateFrom = new Date();
  public money = 123245.234555;
  // constructor(public holaMundoTest: HolaMundoTestService) {}
}

有什么想法吗?我正在导入保存所有这些默认管道的CommonModule,这可能是最小的库。

angular angular7 angular-pipe angular-library
1个回答
0
投票

在库中,您必须在模块中导出所有组件和管道。然后在需要的地方导入该模块。该链接应举例说明https://angular.io/guide/sharing-ngmodules

如果没有帮助,也许此库可能有用https://github.com/ng-packagr/ng-packagr。它用于打包角度库。

© www.soinside.com 2019 - 2024. All rights reserved.