Angular 7+中的ClassDefinition是否有类似的模拟？

Question

I am migrating angular v4 project to a Angular 7. I have faced legacy code and i I can not get rid off that. It has ClassDefinition interface whereas new Angular 7 does not have it. How can I deal with this problem? Example of code is shown below.

I have tried to find out solutions in changelogs of angular documentation but it did not help me at all.

import { ClassDefinition} from "@angular/core";

let componentDefinition: ClassDefinition = {
    constructor: MenuItem
};

Answer 1

If you talk about this: https://v4.angular.io/api/core/ClassDefinition - the first option would be to just declare it in your module:

/**
 * Declares the interface to be used with {@link Class}.
 *
 * @stable
 */
export type ClassDefinition = {
  /**
   * Optional argument for specifying the superclass.
   */
  extends?: Type<any>;

  /**
   * Required constructor function for a class.
   *
   * The function may be optionally wrapped in an `Array`, in which case additional parameter
   * annotations may be specified.
   * The number of arguments and the number of parameter annotations must match.
   *
   * See {@link Class} for example of usage.
   */
  constructor: Function | any[];
} &
{
  /**
   * Other methods on the class. Note that values should have type 'Function' but TS requires
   * all properties to have a narrower type than the index signature.
   */
  [x: string]: Type<any>|Function|any[];
};

After that, you would need to decide how to deal with a situation based on your code base, but what you should know- is that API was marked as stable but then it was deleted by https://github.com/angular/angular/commit/cac130eff9b9cb608f2308ae40c42c9cd1850c4d#diff-635fe23be5795132e3385c8f4899dc3a

As you can see - the reason was:

This mode doesn't allow build tools like Webpack to process and optimize the code, which results in prohibitively large bundles. We are removing this API because we are trying to ensure that everyone is on the fast path by default, and it is not possible to get on the fast path using the ES5 DSL. The replacement is to use TypeScript and @decorator format.

So you should refactor your legacy code and use TypeScript in the end.