Issue
I am working with SPA (single page application) , I have used Vue framework to develop the application.
- Front-End : Vue
- Back-End : NodeJs
In my application I have other sub-modules written in angular 4, I want to write the functionality provided by Vue in angular.
Here is the link which can explain the <slot>
functionality.
Can anyone suggest solution to implement the same in Angular4 onwards?
Solution
That's called transclusion, and is implemented with ng-content
through Angular.
See some tutorials online, such as https://scotch.io/tutorials/angular-2-transclusion-using-ng-content
This allows you to create components like this :
@Component({
selector: 'app-component',
template: `<div class="container"><ng-content></ng-content></div>`
})
export class AppComponent {}
In your HTML :
<app-component>Some text</app-component>
Will be rendered as :
<div class="container">Some text</div>
Even you can have named ng-content
too. if you have multiple contents to be replaced. for example -
<ng-content select="[card-body]"></ng-content>
Answered By - user4676340
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.