downgradeComponent — Angular

Вспомогательная функция, позволяющая использовать компонент Angular из AngularJS.

API

function downgradeComponent(info: {
  component: Type<any>;
  downgradedModule?: string | undefined;
  propagateDigest?: boolean | undefined;
  inputs?: string[] | undefined;
  outputs?: string[] | undefined;
  selectors?: string[] | undefined;
}): any;

@paraminfo

{ component: Type<any>; downgradedModule?: string | undefined; propagateDigest?: boolean | undefined; inputs?: string[] | undefined; outputs?: string[] | undefined; selectors?: string[] | undefined; }

содержит информацию о компоненте, для которого выполняется понижение версии:

component: Type<any>: Тип компонента, для которого будет выполнено понижение версии
downgradedModule?: string: Имя модуля с пониженной версией (если есть), которому «принадлежит» компонент, как возвращается при вызове downgradeModule(). Именно соответствующий ему модуль Angular будет загружен, когда потребуется создать экземпляр компонента.

(Этот параметр необходим только при использовании `downgradeModule()` для понижения версии более чем одного модуля Angular.) - `propagateDigest?: boolean`: Определяет, следует ли выполнять detectChanges для компонента при каждом $digest. Если задано значение `false`, обнаружение изменений всё равно будет выполняться при изменении любого из входных данных компонента. (По умолчанию: true)

@returnsany

функция-фабрика, которую можно использовать для регистрации компонента в модуле AngularJS.

Описание

Вспомогательная функция, позволяющая использовать компонент Angular из AngularJS.

Часть библиотеки upgrade/static для гибридных приложений с обновлением, поддерживающих компиляцию AOT

Эта вспомогательная функция возвращает функцию-фабрику, предназначенную для регистрации в AngularJS директивы-обёртки, которая выполняет «понижение версии» компонента Angular.

Примечания по использованию

Примеры

Предположим, что у вас есть компонент Angular под названием ng2Heroes, который необходимо сделать доступным в шаблонах AngularJS.

// This Angular component will be "downgraded" to be used in AngularJS
@Component({
  selector: 'ng2-heroes',
  // This template uses the upgraded `ng1-hero` component
  // Note that because its element is compiled by Angular we must use camelCased attribute names
  template: `<header><ng-content selector="h1"></ng-content></header>
    <ng-content selector=".extra"></ng-content>
    <div *ngFor="let hero of heroes()">
      <ng1-hero [hero]="hero" (onRemove)="removeHero.emit(hero)"
        ><strong>Super Hero</strong></ng1-hero
      >
    </div>
    <button (click)="addHero.emit()">Add Hero</button>`,
  standalone: false,
})
export class Ng2HeroesComponent {
  heroes = input<Hero[]>([]);
  addHero = output<void>();
  removeHero = output<Hero>();
}

Нам нужно создать директиву AngularJS, которая сделает этот компонент Angular доступным в шаблонах AngularJS. Функция downgradeComponent() возвращает функцию-фабрику, с помощью которой можно определить директиву AngularJS, оборачивающую компонент с «пониженной версией».

// This directive will act as the interface to the "downgraded" Angular component
ng1AppModule.directive('ng2Heroes', downgradeComponent({component: Ng2HeroesComponent}));

Дополнительные сведения и примеры по понижению версии компонентов Angular до компонентов AngularJS см. в руководстве по обновлению.