simple ng-content not working in angular 2

I try to transclude content. I have the following markup for the component:

<body> <bn-menu> <span>test</span> <p>I am content</p> </bn-menu> </body>

And the following component:

import { Component } from '@angular/core';
@Component({ selector: 'bn-menu', template: '<div><div>Jo</div><ng-content></ng-content></div>'
})
export class MenuComponent { }

But only "Jo" gets displayed and not "test" or "I am content". What am I doing wrong?

1

1 Answer

It seems you are trying to display the content in the Root component, Content within the Root component are typically used for displaying content used while angular is booting up.

If you can wrap bn-menu inside some other root component it should work.

Check this SO question Component with <ng-content>

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

You Might Also Like