javascript - 为什么 Angular 不允许我将参数传递给提供者的 useFactory 中的函数？

Question

app.module.ts

   bootstrap: [AppComponent],
      declarations: [AppComponent],
      imports: [
        CoreModule,
        HelloFrameworkModule,
      ],
      providers: [{
        provide: Logger,
        useFactory: loggerProviderFunc(1),

      }]
    })

app.component.ts

@Component({
  selector: 'my-app',
  styleUrls: ['./app.component.scss'],
  templateUrl: './app.component.html',
})
export class AppComponent {
   constructor(private c:Logger){ 
   }
}

logger.ts

export class Logger {
  constructor(private msg: string) {
     console.log(this.msg);
  } 
}

Error:ERROR TypeError: factory is not a function at _callFactory

我在控制台中将 1 作为传递值，但紧随其后我也收到错误。但是，如果我只是删除参数，即将 loggerProviderFunc(1) 更改为 loggerProviderFunc

，我在控制台中会得到零错误

Answer 1

provideFactory: 字段需要一个函数，而不是函数调用的结果。

如果你想将它与参数一起使用，你可以使用箭头表达式:

bootstrap: [AppComponent],
  declarations: [AppComponent],
  imports: [
    CoreModule,
    HelloFrameworkModule,
  ],
  providers: [{
    provide: Logger,
    useFactory: () = > loggerProviderFunc(1),
  }]
})

也许 Angular 还允许为 useValue: 调用函数，但我还没有测试过。如果这有效，请注意它只会被调用一次，而每次解析器执行其解析工作时都会调用工厂方法。

bootstrap: [AppComponent],
  declarations: [AppComponent],
  imports: [
    CoreModule,
    HelloFrameworkModule,
  ],
  providers: [{
    provide: Logger,
    useValue: loggerProviderFunc(1)
  }]
})