https://techoverflow.net/2018/02/17/how-to-fix-angular-typeerror-templateref-createembeddedview-is-not-a-function/

од, который я пытаюсь заставить работать (угловой 5):

  import { Component, ViewChild, TemplateRef, ViewContainerRef } from '@angular/core';

@Component({
  selector: 'vcr',
  template: `
    <template #tpl>
      <h1>ViewContainerRef</h1>
    </template>
    <div>Some element</div>
    <div #container></div>
  `,
})
export class VcrCmp {
  @ViewChild('container', { read: ViewContainerRef }) _vcr;
  @ViewChild('tpl') tpl: TemplateRef<any>;

  constructor(
    private viewContainerRef: ViewContainerRef
  ) {

  }

  ngAfterViewInit() {
    console.info(this.viewContainerRef);
    console.info(this._vcr);

    this._vcr.createEmbeddedView(this.tpl);
    this.viewContainerRef.createEmbeddedView(this.tpl);
  }
}

Проблема в том, что у меня это есть (templateRef.createEmbeddedView is not a function) ошибка и не очень понимаю, почему.

Этот код основан на этом примереhttps://netbasal.com/angular-2-understanding-viewcontainerref-acc183f3b682 так что я думаю, это должно сработать.

Что я делаю неправильно?

 Günter Zöchbauer07 нояб. 2017 г., 12:57
Что оthis.viewContainerRef.createEmbeddedView(this.tpl);
 k10207 нояб. 2017 г., 12:59
@ GünterZöchbauer - оба вызова выдают одинаковую ошибку

Ответы на вопрос(3)

ngTemplateOutlet

 Sheshank S.19 июн. 2018 г., 01:15
Это должен быть комментарий, а не ответ, так как он не отвечает на вопрос
 Josh31 июл. 2018 г., 02:55
Я тоже скучал по этому ... Спасибо Максим!
 James Poulose14 нояб. 2018 г., 06:22
@ SheshankS. С уважением не согласен. Для одной и той же ошибки может быть несколько причин. Что цитировал МаксимЯВЛЯЕТСЯ одна из многочисленных причин ошибки OP сообщила.
 ingaham02 июл. 2018 г., 16:53
Я рад, что это было здесь, иначе я бы пропустил это, и это помогло мне прямо сейчас!

предложение else не может быть произвольным компонентом, но это должен быть шаблон ng.

Например,

в компоненте, где у вас есть исходный код, похожий на этот:

<div *ngIf="myCondition ; else elseSection">
    <!-- ... -->
</div>
<div #elseSection>
    <!-- ... -->
</div>

Полученный исходный код должен выглядеть так:

<div *ngIf="myCondition ; else elseSection">
    <!-- ... -->
</div>
<ng-template #elseSection>
    <!-- ... -->
</ng-template>

ссылка:https://techoverflow.net/2018/02/17/how-to-fix-angular-typeerror-templateref-createembeddedview-is-not-a-function/

Решение Вопроса

Опция компилятора enableLegacyTemplate теперь отключена по умолчанию, поскольку этот элемент устарел с версии v4. использование<ng-template> вместо.

Так что вы должны использоватьng-template вместоtemplate:

<ng-template #tpl>
   <h1>ViewContainerRef</h1>
</ng-template>

Пример Stackblitz

или установитьenableLegacyTemplate вfalse:

platformBrowserDynamic().bootstrapModule(AppModule, { enableLegacyTemplate: true })

Пример Stackblitz

Но вы должны знать, что

Опция enableLegacyTemplate и<template> оба элемента будут удалены в Angular v6.

 k10208 нояб. 2017 г., 08:38
Спасибо! Это решило проблему

Ваш ответ на вопрос