本文整理匯總了TypeScript中@angular/cdk/scrolling.ViewportRuler類的典型用法代碼示例。如果您正苦於以下問題：TypeScript ViewportRuler類的具體用法？TypeScript ViewportRuler怎麽用？TypeScript ViewportRuler使用的例子？那麽, 這裏精選的類代碼示例或許可以為您提供幫助。
在下文中一共展示了ViewportRuler類的5個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: describe
describe('BlockScrollStrategy', () => {
let platform = new Platform();
let viewport: ViewportRuler;
let overlayRef: OverlayRef;
let componentPortal: ComponentPortal<FocacciaMsg>;
let forceScrollElement: HTMLElement;
beforeEach(async(() => {
// Ensure a clean state for every test.
document.documentElement.classList.remove('cdk-global-scrollblock');
TestBed.configureTestingModule({
imports: [OverlayModule, PortalModule, OverlayTestModule]
}).compileComponents();
}));
beforeEach(inject([Overlay, ViewportRuler], (overlay: Overlay, viewportRuler: ViewportRuler) => {
let overlayState = new OverlayState({scrollStrategy: overlay.scrollStrategies.block()});
overlayRef = overlay.create(overlayState);
componentPortal = new ComponentPortal(FocacciaMsg);
viewport = viewportRuler;
forceScrollElement = document.createElement('div');
document.body.appendChild(forceScrollElement);
forceScrollElement.style.width = '100px';
forceScrollElement.style.height = '3000px';
forceScrollElement.style.background = 'rebeccapurple';
}));
afterEach(inject([OverlayContainer], (container: OverlayContainer) => {
overlayRef.dispose();
document.body.removeChild(forceScrollElement);
setScrollPosition(0, 0);
container.getContainerElement().parentNode!.removeChild(container.getContainerElement());
}));
it('should toggle scroll blocking along the y axis', skipIOS(() => {
setScrollPosition(0, 100);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(document.documentElement.style.top)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
setScrollPosition(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
setScrollPosition(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));
it('should toggle scroll blocking along the x axis', skipIOS(() => {
forceScrollElement.style.height = '100px';
forceScrollElement.style.width = '3000px';
setScrollPosition(100, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(document.documentElement.style.left)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
setScrollPosition(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
setScrollPosition(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));
it('should toggle the `cdk-global-scrollblock` class', skipIOS(() => {
expect(document.documentElement.classList).not.toContain('cdk-global-scrollblock');
overlayRef.attach(componentPortal);
expect(document.documentElement.classList).toContain('cdk-global-scrollblock');
overlayRef.detach();
expect(document.documentElement.classList).not.toContain('cdk-global-scrollblock');
}));
it('should restore any previously-set inline styles', skipIOS(() => {
const root = document.documentElement;
root.style.top = '13px';
//.........這裏部分代碼省略.........
示例2: describe
describe('BlockScrollStrategy', () => {
let platform: Platform;
let viewport: ViewportRuler;
let documentElement: HTMLElement;
let overlayRef: OverlayRef;
let componentPortal: ComponentPortal<FocacciaMsg>;
let forceScrollElement: HTMLElement;
beforeEach(async(() => {
documentElement = document.documentElement!;
// Ensure a clean state for every test.
documentElement.classList.remove('cdk-global-scrollblock');
TestBed.configureTestingModule({
imports: [OverlayModule, PortalModule, OverlayTestModule]
}).compileComponents();
}));
beforeEach(inject([Overlay, ViewportRuler, Platform],
(overlay: Overlay, viewportRuler: ViewportRuler, _platform: Platform) => {
let overlayConfig = new OverlayConfig({scrollStrategy: overlay.scrollStrategies.block()});
overlayRef = overlay.create(overlayConfig);
componentPortal = new ComponentPortal(FocacciaMsg);
viewport = viewportRuler;
forceScrollElement = document.createElement('div');
document.body.appendChild(forceScrollElement);
forceScrollElement.style.width = '100px';
forceScrollElement.style.height = '3000px';
forceScrollElement.style.background = 'rebeccapurple';
platform = _platform;
}));
afterEach(inject([OverlayContainer], (container: OverlayContainer) => {
overlayRef.dispose();
document.body.removeChild(forceScrollElement);
window.scroll(0, 0);
container.getContainerElement().parentNode!.removeChild(container.getContainerElement());
}));
it('should toggle scroll blocking along the y axis', skipIOS(() => {
window.scroll(0, 100);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(documentElement.style.top)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
window.scroll(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
window.scroll(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));
it('should toggle scroll blocking along the x axis', skipIOS(() => {
forceScrollElement.style.height = '100px';
forceScrollElement.style.width = '3000px';
window.scroll(100, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(documentElement.style.left)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
window.scroll(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
window.scroll(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));
it('should toggle the `cdk-global-scrollblock` class', skipIOS(() => {
expect(documentElement.classList).not.toContain('cdk-global-scrollblock');
overlayRef.attach(componentPortal);
expect(documentElement.classList).toContain('cdk-global-scrollblock');
overlayRef.detach();
expect(documentElement.classList).not.toContain('cdk-global-scrollblock');
}));
//.........這裏部分代碼省略.........
示例3: it
it('should toggle scroll blocking along the y axis', skipIOS(() => {
setScrollPosition(0, 100);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(document.documentElement.style.top)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
setScrollPosition(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().top)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
setScrollPosition(0, 300);
expect(viewport.getViewportScrollPosition().top)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));示例4: it
it('should toggle scroll blocking along the x axis', skipIOS(() => {
forceScrollElement.style.height = '100px';
forceScrollElement.style.width = '3000px';
window.scroll(100, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected viewport to be scrollable initially.');
overlayRef.attach(componentPortal);
expect(documentElement.style.left)
.toBe('-100px', 'Expected <html> element to be offset by the previous scroll amount.');
window.scroll(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected the viewport not to scroll.');
overlayRef.detach();
expect(viewport.getViewportScrollPosition().left)
.toBe(100, 'Expected old scroll position to have bee restored after disabling.');
window.scroll(300, 0);
expect(viewport.getViewportScrollPosition().left)
.toBe(300, 'Expected user to be able to scroll after disabling.');
}));示例5: setScrollPosition
/**
* Scrolls the viewport and clears the cache.
* @param x Amount to scroll along the x axis.
* @param y Amount to scroll along the y axis.
*/
function setScrollPosition(x: number, y: number) {
window.scroll(x, y);
viewport._cacheViewportGeometry();
}