Include components in different parts of the page

Question

Include components in different parts of the page

Navigation

#1 by (0 votes)

0

Suppose I have the following structure:

<table>
   <tbody>
   </tbody>
</table>

<form>
</form>

The pages that inherit this template will define which rows and columns my tables will have, what form fields and what the buttons will be.

I have different areas of my template that need to be filled out. How should I proceed?

javascript typescript angular

asked by anonymous 11.10.2017 / 14:43

1 answer

Problems adding foreign key in MySQL How to implement an arraylist in a condition?

score 0 · Accepted Answer

I answered a similar question in the post link

Complementing:

If you want to pass parameters to the component enter in the field -update.user.ts:

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

@Component({
   selector: 'my-campo-busca',
   templateUrl: './campo-busca.component.html',
   styleUrls: ['./campo-busca.component.css']
 }) 

export class CampoBuscaComponent { 
    @Input nome: string;

    constructor() {
    }
}

Use the parameter injected into the component template (field-search.component.html):

<input type="text" [value]="nome">

To consume the component use the tag defined in the selector and provide the parameters as attributes.

Example providing string:

<my-campo-busca nome="nome string fixa" ></my-campo-busca>

Example providing a variable:

<my-campo-busca [nome] ="variavel" ></my-campo-busca>

If you want to define injected templates in your component. By Ex:

<my-painel-leitura>
   <ng-container titulo>
   ‎   <h1>Título</h1>
   ‎</ng-content>
   ‎<ng-container conteudo>
   ‎   Conteúdo! 
   ‎</ng-content>
</my-painel-leitura>

Read about transclusion: link