错误:没有NgControl Angular AOT的提供者 [英] ERROR in : No provider for NgControl Angular AOT
问题描述
我正在尝试实现一个自定义ControlValueAccessor,就像Kara Erickson在上一个Angular Connect https:// youtu。是/ CD_t3m2WMM8?t = 20m22s 。将有效状态从父组件传递给子组件。
I am trying to implement a custom ControlValueAccessor as Kara Erickson recommended on last Angular Connect https://youtu.be/CD_t3m2WMM8?t=20m22s . To pass the validity state from the parent component to the child one.
app.component.html:
app.component.html:
<app-country-select ngModel="model" name="country-select"></app-country-select>
country-select.component.html:
country-select.component.html:
<select [formControl]="controlDir.control" #select placeholder="Country" i18n-placeholder (click)="onTouched()"
(change)="onChange($event.value)" [required]="required">
<option value="at">Austria</option>
<option value="au">Australia</option>
</select>
country-select.component.ts:
country-select.component.ts:
@Component({
selector: 'app-country-select',
templateUrl: './country-select.component.html',
styleUrls: ['./country-select.component.scss'],
})
export class CountrySelectComponent implements ControlValueAccessor {
@Input() required = false;
@ViewChild('select') select: HTMLSelectElement;
onChange: (value: any) => void;
onTouched: () => void;
constructor(@Self() public controlDir: NgControl) {
controlDir.valueAccessor = this;
}
...
}
完整代码存在于此处: https://github.com/maksymzav/ngcontrol 。
The full code lives here: https://github.com/maksymzav/ngcontrol .
在JIT模式下运行代码时,代码运行正常。我想因为在运行时它确实知道它使用了哪个控件:NgModel,或FormControlName,或FormControlDirective。
但是当我使用 ng build --prod
运行AOT构建时,它失败并显示消息
The code works perfectly when running it in the JIT mode. I guess because in runtime it does know with which control it is used: NgModel, or FormControlName, or FormControlDirective.
But when I run an AOT build with ng build --prod
it fails with message
错误输入:没有NgControl的提供者([错误 - >]< app-country-select>< / app-country-select>)
ERROR in : No provider for NgControl ("[ERROR ->]<app-country-select></app-country-select>")
有谁知道如何使这个构建成功?谢谢。
Does anyone know how to make this build successful? Thank you.
推荐答案
你可以添加 @Optional()
decorator到你的 controlDir
。
将依赖关系标记为可选的参数元数据。如果找不到依赖项,则注入器
提供null。
A parameter metadata that marks a dependency as optional. Injector provides null if the dependency is not found.
在我的情况下,这解决了No provider错误,我能够成功编译该项目。
In my case, that solved the "No provider" error and I was able to successfully compile the project.
示例:
constructor(
@Optional() // Add this decorator
@Self()
public controlDir: NgControl,
private stripe: StripeService,
private cd: ChangeDetectorRef
) {
// Better to add some checks here since controlDir can be null
if (controlDir) {
controlDir.valueAccessor = this;
}
}
这篇关于错误:没有NgControl Angular AOT的提供者的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!