Building a wrapper directive (wrap some content / component) in angular2

Question

I\'m pretty new building directives with Angular2. What I want is to create a popup directive that will wrap the content with some css classes.

Content

Answer 1

You can achieve this with a component attribute selector and Angular 2 Content Projection

@Component({
  selector: 'my-app',
  template: `
    
 
        

            
Header
            Content to be placed here.
        
 
    
  `
})
export class AppComponent {}


@Component({
  selector: '[myWrapper]',
  template: `
    

      

          
      
    
  `
})
export class MyComponent {

}