本文整理汇总了TypeScript中@angular/cdk/overlay.Overlay.create方法的典型用法代码示例。如果您正苦于以下问题：TypeScript Overlay.create方法的具体用法？TypeScript Overlay.create怎么用？TypeScript Overlay.create使用的例子？那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类@angular/cdk/overlay.Overlay的用法示例。
在下文中一共展示了Overlay.create方法的4个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: ngAfterViewInit
ngAfterViewInit() {
this._portal = new TemplatePortal(this._dialogTemplate, this._viewContainerRef);
this._overlayRef = this._overlay.create({
positionStrategy: this._overlay.position().global().centerHorizontally().centerVertically(),
hasBackdrop: true
});
this._overlayRef.backdropClick().subscribe(() => this._overlayRef.detach());
}示例2: createModal
// Create component to ApplicationRef
private createModal(): void {
this.overlayRef = this.overlay.create();
this.modalRef = this.overlayRef.attach(new ComponentPortal(NzModalComponent));
}示例3: attachCodePanel
export function attachCodePanel(
componentFactoryResolver: ComponentFactoryResolver,
overlay: Overlay,
parentInjector: Injector,
) {
const overlayRef = overlay.create()
let previousOrigin
return (editor: EditorService) => {
const pluginState: CodeBlockState = pluginKey.getState(editor.state)
const origin = pluginState.element
if (!pluginState.toolbarVisible) {
overlayRef.detach()
return
}
const toolbar = new FloatingToolbar(editor, overlayRef)
const injector = Injector.create({
parent: parentInjector,
providers: [
{
provide: FloatingToolbar,
useValue: toolbar,
},
{
provide: EditorToolbar,
useValue: toolbar,
},
],
})
const linkPanelPortal = new ComponentPortal(CodePanelComponent, null, injector)
const positions = [
new ConnectionPositionPair(
{ originX: "center", originY: "bottom" },
{ overlayX: "center", overlayY: "top" },
),
]
if (previousOrigin !== origin) {
overlayRef.detach()
}
if (!overlayRef.hasAttached()) {
overlayRef.attach(linkPanelPortal)
const strategy = overlay
.position()
.flexibleConnectedTo(origin)
.withFlexibleDimensions(false)
.withPush(false)
.withPositions(positions)
const scrollStrategy = overlay.scrollStrategies.reposition()
strategy.attach(overlayRef)
strategy.apply()
scrollStrategy.attach(overlayRef)
scrollStrategy.enable()
overlayRef.updatePositionStrategy(strategy)
previousOrigin = origin
}
}
}示例4: attachLinkPanel
export function attachLinkPanel(
componentFactoryResolver: ComponentFactoryResolver,
overlay: Overlay,
parentInjector: Injector,
) {
const overlayRef = overlay.create()
return (editor: EditorService) => {
const pluginState: HyperlinkState = pluginKey.getState(editor.state)
const { link } = editor.state.schema.marks
let origin
let previousOrigin
if (!pluginState.activeLinkMark || !link) {
overlayRef.detach()
return
}
const toolbar = new FloatingToolbar(editor, overlayRef)
const injector = Injector.create({
parent: parentInjector,
providers: [
{
provide: FloatingToolbar,
useValue: toolbar,
},
{
provide: EditorToolbar,
useValue: toolbar,
},
],
})
const linkPanelPortal = new ComponentPortal(LinkPanelComponent, null, injector)
const positions = [
new ConnectionPositionPair(
{ originX: "start", originY: "bottom" },
{ overlayX: "start", overlayY: "top" },
),
new ConnectionPositionPair(
{ originX: "start", originY: "top" },
{ overlayX: "start", overlayY: "bottom" },
),
]
switch (pluginState.activeLinkMark.type) {
case InsertStatus.EDIT_LINK_TOOLBAR: {
const el = editor.view.nodeDOM(pluginState.activeLinkMark.pos)
origin = el.parentElement as HTMLElement
break
}
case InsertStatus.INSERT_LINK_TOOLBAR: {
const el = editor.view.domAtPos(pluginState.activeLinkMark.from)
origin = el.node as HTMLElement
break
}
default:
}
if (previousOrigin !== origin) {
overlayRef.detach()
}
if (!overlayRef.hasAttached()) {
overlayRef.attach(linkPanelPortal)
const strategy = overlay
.position()
.flexibleConnectedTo(origin)
.withFlexibleDimensions(false)
.withPush(false)
.withPositions(positions)
const scrollStrategy = overlay.scrollStrategies.reposition()
strategy.attach(overlayRef)
strategy.apply()
scrollStrategy.attach(overlayRef)
scrollStrategy.enable()
overlayRef.updatePositionStrategy(strategy)
previousOrigin = origin
}
}
}