小编Jer*_*oen的帖子

Angular Material:BreakpointObserver 无法从负载中获得?

在将 AngularBreakpointObserver与 结合使用时Angular Material,我尝试使用 Material Design 规范的断点(Breakpoints例如Breakpoints.LandscapePortrait,它们在 中定义Breakpoints.HandsetPortrait)。

breakpointObserver 工作,除了当我刚加载页面时。breakpointObserver 仅观察到更改才会触发,但考虑到它是新加载,目前还没有更改。这意味着尚未针对断点评估初始视口。我试过使用单个BreakpointObserver.isMatchedin OnInit,但这似乎没有任何效果。

我列入BreakpointObserverBreakpointsMediaMatcher到共享服务,这是我在所有认购组件需要“听”到断点。

我的问题是:如何确保在第一次视口更改之前评估断点(如果用户不调整窗口大小/更改设备方向,这可能根本不会发生)?

这是我的代码shared.service.ts

import {Component, OnDestroy, OnInit, Injectable,Input,Output,EventEmitter} from '@angular/core';
import {BreakpointObserver, Breakpoints, MediaMatcher} from '@angular/cdk/layout';

@Injectable()
export class SharedService implements OnDestroy, OnInit {
    public isCollapsed = false;
    public isOpen = false;
    public isMobileView = false;
    public isTabletView = false;
    private breakpointObserver: BreakpointObserver; …
Run Code Online (Sandbox Code Playgroud)

breakpoints angular angular-cdk

6
推荐指数
1
解决办法
3357
查看次数

wild scroll输入android

我正在开发一个响应式网站,它有一个不同的移动或桌面样式表.一切看起来都不错,效果很好,直到文本输入与移动设备进行交互.他们出现了应有的表现.但是一旦点击(ehrm ..触摸),我发现Android中的浏览器开始像疯了一样滚动,打字时也是如此.但是,文本输入到输入中,并且输入上的软键盘/焦点不会丢失.

我的项目可以在这里找到:http://www.gortzfruit.nl/new/

问题是我一直在寻找解决方案一段时间,并发现类似的问题,解决方案没有为我解决.我一直在研究的一些主题和解决方案是:

https://github.com/scottjehl/Device-Bugs/issues/3 - 这里建议问题在于定位元素.特别是在固定定位元素内绝对.这在我的设计中反复出现,但一旦删除它就无法解决问题.

Android浏览器textarea滚动到处,无法使用 - 这表明问题出在css-properties -webkit-transform:translate3d(0,0,0); 和-webkit-backface-visibility:hidden;.我自己没有包含这些,但我认为我包含的Google Maps API可能会使用这些.在分析了Google Maps API生成的标记后,我发现他们也没有使用它.

当固定位置文本输入表单字段获得焦点时,如何防止滚动? - 这一个专注于试图解决问题.设置主体溢出:隐藏; 被建议在聚焦时阻止滚动,但它对我不起作用.

在javascript中禁用对输入焦点的滚动 - 这里建议在keydown上返回false可能会解决问题,我试过没有成功.这个阻止我的文本实际输入输入.

我知道这与Android中的错误有关,导致这种奇怪的滚动.但我不知道如何应对这一点.对我来说,无论我是否知道如何避免这个错误,或者我是否找到了一个黑客来使这个bug变得不可思议.我只是想在文本框上键入和聚焦/模糊时摆脱奇怪的滚动行为.

提前致谢,

吉荣

css android scroll textinput

5
推荐指数
1
解决办法
1872
查看次数

标签 统计

android ×1

angular ×1

angular-cdk ×1

breakpoints ×1

css ×1

scroll ×1

textinput ×1