0

I'm attempting to build an Angular 2 project, using angular-cli with the --prod and --aot arguments. The build is failing with the following error:

Property 'required' does not exist on type '{ [key: string]: any; }'.

In my HTML, I'm using HTML validation on some of my inputs (required, pattern attributes).

Using JIT compilation, these work as expected. It is only during AoT compilation that the errors occur.

Has anyone seen this before? I was hoping not to have to resort to defining all of my forms using the ReactiveForms method and using the Angular Validators, unless there's no way around it.

1 Answers1

2

The following are some things that will make AoT compile fail.

  • Don’t use require statements for your templates or styles, use styleUrls and templateUrls, the angular2-template-loader plugin will change it to require at build time.
  • Don’t use default exports.
  • Don’t use form.controls.controlName, use form.get(‘controlName’)
  • Don’t use control.errors?.someError, use control.hasError(‘someError’)
  • Don’t use functions in your providers, routes or declarations, export a function and then reference that function name
  • @Inputs, @Outputs, View or Content Child(ren), Hostbindings, and any field you use from the template or annotate for Angular should be public
Babar Hussain
  • 2,917
  • 1
  • 17
  • 14
  • That was it! I was using control.errors?.error in every location that was flagged by the AoT compiler. By changing them to control.hasError('error'), the compiler errors were removed. Thank you! As a side note, the list of compilation pitfalls was extremely helpful, and I think anyone performing AoT compilation would benefit greatly from this information. Is this list available somewhere? – Michael Barrett Mar 28 '17 at 17:00
  • I've created this list with my own research since I was facing issues in my compilations got points from different places soon I'll create a blog on this – Babar Hussain Mar 28 '17 at 19:45