Angular 2基于桌面或移动设备的不同视图

Question

我正在开发基于版本桌面/移动版的略有不同功能的网站。

我尝试通过@View应用它，但看起来这个装饰器现在已被弃用。 请告诉我最佳实践，如何在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

ng2-responsive软件包应满足您的需求： https ： ng2-responsive

我还没有广泛使用它，但似乎做得不错。

@View被合并到@Component （很久以前）。 @Component应该是你需要的唯一装饰器。

Answer 3

目前最好替换@View装饰器使用这样的*ngIf ：

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