Как лучше всего показывать или отображать один компонент внутри другого компонента под углом?

Question

Я создал новый компонент в угловом формате 7

ng g c mynewcomp

, который содержит функции рендеринга данных из бэкэнда и отображается в HTML.

, но я хочу разместитьнапример, новый вид / компонент в другом существующем компоненте

. Пользователь может просматривать содержимое в старом компоненте при условии, что необходимо отобразить содержимое моего нового компонента,

, что является наилучшей практикой длясделать это без какого-либо влияния на старый и новый компонент

Answer 1

Чтобы выполнить требование, при котором пользователь может просматривать содержимое в старом компоненте, при котором должен отображаться контент моего нового компонента, .,

в конце старой html-страницы компонента добавьте селектор для нового компонента

<app-mynewcomp></app-mynewcomp>.

При этом приложение будет работать обычным образом, n сверху будет отображаться старый контент иниже нового.

Answer 2

создание двух компонентов: 1. oldComponent 2. newComponent

app.module.ts

import { oldComponent } from './oldComponent.component';
import { newComponent } from './newComponent.component';

declarations: [
    oldComponent,
    newComponent 
  ]

Включение двух селекторов компонентов в app.component.html app.component.html

<oldComponent></oldComponent>

oldComponent.component.html

<p> oldComponent works! </p>
<newComponent></newComponent>

см. Ниже пример slackblitz, который я создал, чтобы удовлетворить вашинужен slackblitz пример

Answer 3

В html старого компонента поместите селектор нового компонента, как показано ниже:

<app-mynewcomp></app-mynewcomp>