CODEWITHSUNDEEP
angulartypescript
Felix Christo
Felix Christo

Reputation: 287

Using HTML in multiple components

Is it is possible to use a HTML of one component in another component ? If I go with Selector then it will render with TS Component also (i.e) functionality. I just that particular HTML page to be used multiple places? any ways?

Upvotes: 0

Views: 383

Answers (1)

joka00
joka00

Reputation: 2537

Yes it is possible you can create a typescript file which will export that template

export const HTMLTemplate = `here will be the template`

And the you will change templateUrl: 'url' to template: HTMLTemplate and import the HTMLTemplate from file you have created.

Detail:

You can create typescript file let's call it HTMLtemplate.ts

In that file you will add this line

export const HTMlTemplate = `<div></div>`;

Instead of <div></div> you can use your template you want to share between components.

As a next step you will go to the component where you want to use the shared code and you will change it from this

@Component({ selector: 'app-selector', templateUrl: './selector.component.html', styleUrls: ['./selector.component.scss'] })

to this

import {HTMLTemplate} from 'where the HTMLtemplate.ts is'; @Component({ selector: 'app-selector', template: HTMLTemplate, styleUrls: ['./selector.component.scss'] })

Upvotes: 1

Related Questions