NgTemplateOutlet

Вставляет встроенное представление из подготовленного TemplateRef.

API

class NgTemplateOutlet<C = unknown> implements OnChanges {
  constructor(_viewContainerRef: ViewContainerRef): NgTemplateOutlet<C>;
  @Input() ngTemplateOutletContext: C | null | undefined;
  @Input() ngTemplateOutlet: TemplateRef<C> | null | undefined;
  @Input() ngTemplateOutletInjector: Injector | "outlet" | null | undefined;
  protected injector: Injector;
}

constructor

NgTemplateOutlet<C>

@param_viewContainerRefViewContainerRef

@returnsNgTemplateOutlet<C>

ngTemplateOutletContext

C | null | undefined

Объект контекста, присоединяемый к EmbeddedViewRef. Это должен быть объект; его ключи будут доступны для привязки в объявлениях локальных переменных шаблона let. Использование ключа $implicit в объекте контекста задаст его значение по умолчанию.

TemplateRef<C> | null | undefined

Строка, определяющая ссылку на шаблон и, при необходимости, объект контекста для шаблона.

ngTemplateOutletInjector

Injector | "outlet" | null | undefined

Инъектор, используемый во встроенном представлении. Значение "outlet" можно использовать, чтобы указать, что инъектор должен наследоваться от расположения точки выхода шаблона в созданном DOM.

injector

Injector

ngOnChanges

void

@paramchanges{ [propName: string]: SimpleChange<any>; }

@returnsvoid

Описание

Вставляет встроенное представление из подготовленного TemplateRef.

К EmbeddedViewRef можно прикрепить объект контекста, задав [ngTemplateOutletContext]. [ngTemplateOutletContext] должен быть объектом; его ключи будут доступны для привязки в объявлениях локальных переменных шаблона let.

Экспортируется из

CommonModule

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

<ng-container *ngTemplateOutlet="templateRefExp; context: contextExp"></ng-container>

Использование ключа $implicit в объекте контекста задаст его значение по умолчанию.

Пример

@Component({
  selector: 'ng-template-outlet-example',
  imports: [NgTemplateOutlet],
  template: `
    <ng-container *ngTemplateOutlet="greet"></ng-container>
    <hr />
    <ng-container *ngTemplateOutlet="eng; context: myContext"></ng-container>
    <hr />
    <ng-container *ngTemplateOutlet="svk; context: myContext"></ng-container>
    <hr />

    <ng-template #greet><span>Hello</span></ng-template>
    <ng-template #eng let-name
      ><span>Hello {{ name }}!</span></ng-template
    >
    <ng-template #svk let-person="localSk"
      ><span>Ahoj {{ person }}!</span></ng-template
    >
  `,
})
export class NgTemplateOutletExample {
  myContext = {$implicit: 'World', localSk: 'Svet'};
}