Angular 2 different views based on Desktop or Mobile

Question

I'm working on web site, that has slight different functionality based on version desktop/mobile.

I tried to apply it via @View, but it looks like this decorator is now deprecated. Please, advise me best practice, how to implement this feature in Angular 2.

Answer 1

@Component({
  selector: 'my-component',
  templateUrl: "./" + (window.screen.width > 900 ? 
                     "my-component.desktop.html" : 
                     "my-component.mobile.html"),
  styleUrls: ['./my-component.css']
})

Answer 2

At the moment the best to replace @View decorator is using an *ngIf like this:

<div *ngIf="isMobile">
    modile stuff
</div>
<div *ngIf="!isMobile">
    desktop stuff
</div>