fix(form-field): annotate base class with Directive for Ivy

This is a resubmit of #17022, excluding the portal changes. It marks the `MatFormFieldControl` as a directive because it's being extended by other directives which can cause errors under Ivy.

Author: crisbeto

src/material/form-field/form-field-control.ts

@@ -8,9 +8,16 @@
 
 import {Observable} from 'rxjs';
 import {NgControl} from '@angular/forms';
+import {Directive, NgModule} from '@angular/core';
 
 
 /** An interface which allows a control to work inside of a `MatFormField`. */
+@Directive({
+  // The @Directive with selector is required here because we're still running a lot of things
+  // against ViewEngine where directives without selectors are not allowed.
+  // TODO(crisbeto): convert to a selectorless Directive after we switch to Ivy.
+  selector: 'do-not-use-abstract-mat-form-field-control',
+})
 export abstract class MatFormFieldControl<T> {
   /** The value of the control. */
   value: T | null;
@@ -67,3 +74,10 @@ export abstract class MatFormFieldControl<T> {
   /** Handles a click on the control's container. */
   abstract onContainerClick(event: MouseEvent): void;
 }
+
+// TODO(crisbeto): remove when `MatFormFieldControl` becomes a selectorless Directive.
+@NgModule({
+  declarations: [MatFormFieldControl as any],
+})
+export class DoNotUseMatFormFieldControlModule {
+}

src/material/form-field/public-api.ts

@@ -9,7 +9,7 @@
 export * from './form-field-module';
 export * from './error';
 export * from './form-field';
-export * from './form-field-control';
+export {MatFormFieldControl} from './form-field-control';
 export * from './form-field-errors';
 export * from './hint';
 export * from './placeholder';