Angular想通过ngIf修改HTML值，这取决于移动vs桌面
Angular想通过ngIf修改HTML值，这取决于移动vs桌面
提问于 2018-08-19 01:36:56
我有一个角度组件，我在其中定义了
在组件中
toggle: boolean = true
toggleDetails()
{
this.toggle = !this.toggle
}在HTML中
<section *ngIf="!toggle">这在台式机和移动设备上都能完美地工作。但现在我不得不在移动端的情况下，默认情况下切换的值为false。因此，我不确定如何实现这一点。在中搜索了一下，发现我们在CSS中有@media属性，但不确定它如何修改ngIf的值。
回答 2
Stack Overflow用户
发布于 2018-08-19 03:42:00
使用以下命令：
function isMobile()
{
return (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) );
}将其赋给一个参数，并将该参数放在*ngIf中。
如果你想根据这个参数修改你的css，你可以使用：
<div [style]="'cssClassA': isMobileParameter"></div>Stack Overflow用户
发布于 2018-08-19 04:55:54
你也可以从@angular/ mediaQuery -layout中使用它，它是一个观察值，可以观察浏览器窗口的宽度，并允许你连续操作。
我做了一个例子，根据mediaQuery将一个mat-button-group切换到一个mat-menu。
在这里查看：https://angular-rb5vmu.stackblitz.io，在底部的“角度材质响应垫-按钮-切换-组”
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51911142
复制相关文章
相似问题