Анализ данных в/Создание динамического компонента angular2

Question

Я пытаюсь разобрать данные из одного компонента в другой.

В принципе, я создал 2 компонента. Мое намерение состоит в том, чтобы создать динамический компонент, где она может быть использована фоновым разработчика, где можно разместить код на своем желаемом месте:

<fl-comtestCom [config]="_messageConfig" > 
    Please <strong><b>remember</b></strong> that you are using ng-content as 
there is <b>no input</b> in description 
</fl-comtestCom> ` 

Но, конечно, должна быть какая-то логика и конфигурация должны быть сделаны ,

Это как логика должна работать ....

Если вход в описании (см в коде ниже в описании: «ошибка»), он будет отображать сообщение об ошибке, в противном случае он будет читать все находится внутри fl-comtestCom [config]="_messageConfig ......

import { Component , OnInit , Input } from '@angular/core'; 
@Component({ 
    selector: 'fl-comtest', 
template: ` 

<fl-comtestCom [config]="_messageConfig" > 
     Please <strong><b>remember</b></strong> that you are using ng-content as there is <b>no input</b> in description 
</fl-comtestCom> ` 
}) 
export class FLComptest implements OnInit{ 

    private _messageConfig: any = { 

    description:"Error", 
    }; 
} 

Мои, если-другое заявление объявляется здесь .... Если мое описание не определено (ложь) будет возвращать все, что находится внутри fl-comtestcom>, иначе, если он не неопределенными (правда). Он должен отображать ошибку.

Я не уверен, как написать синтаксис. Любая помощь приветствуется. Заранее благодарен

import { Component , OnInit , Input } from '@angular/core'; 

@Component({ 
selector: 'fl-comtestCom', 
template: ` 

<template #ngContent> 
    <ng-content></ng-content> 
</template> 

` 
}) 

export class FLTestComponent implements OnInit{ 

    private _message: any = {}; 

    private _default: string = {description : ""}; 
    @Input() config: string; 


    ngOnInit() { 
    console.log(this.config); 

    if(typeof this.config.description == "undefined") { 
     this.description 
    } 
    else (this.config.description != "undefined") { 
     this.description; 
    } 

    } 

} 

Answer 1

Если вы правильно поняли, что хотите отображать разные материалы в зависимости от некоторых условий. Так что я хотел бы сделать это следующим образом:

@Component({ 
    selector: 'fl-comtestCom', 
    template: ` 
     <ng-content *ngIf="!config?.description"></ng-content> 
     <div *ngIf="config?.description" [outerHTML]="config?.description"></div> 
    ` 
}) 
export class FLTestComponent { 
    @Input() config: string; 
} 

Затем используйте это нравится:

<fl-comtestCom [config]="config" > 
    Please <strong><b>remember</b></strong> that you are using ng-content as .... 
</fl-comtestCom> 

, если вы хотите, чтобы отобразить пользовательскую ошибку.

Или не проходят config (или удалить description свойство из config) и он будет отображать свет DOM

Plunker Example