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

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.

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

@@ -8,9 +8,16 @@
 
 import {Observable} from 'rxjs';
 import {NgControl} from '@angular/forms';
+import {Directive} 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;

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

@@ -16,6 +16,7 @@ import {MatLabel} from './label';
 import {MatPlaceholder} from './placeholder';
 import {MatPrefix} from './prefix';
 import {MatSuffix} from './suffix';
+import {MatFormFieldControl} from './form-field-control';
 
 
 @NgModule({
@@ -27,6 +28,10 @@ import {MatSuffix} from './suffix';
     MatPlaceholder,
     MatPrefix,
     MatSuffix,
+
+    // TODO(crisbeto): can be removed once `MatFormFieldControl`
+    // is turned into a selector-less directive.
+    MatFormFieldControl as any,
   ],
   imports: [
     CommonModule,

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';