如何使MdDialog拖能（可移动）在角2材料设计

Question

我创建使用Angular2及其材料设计（https://material.angular.io），在里面我是用MdDialog使用下面的代码显示对话框一个小型Web应用程序：

import {Component} from '@angular/core'; 
import {MdDialog, MdDialogRef} from '@angular/material'; 


@Component({ 
    selector: 'dialog-result', 
    templateUrl: './dialog-result.html', 
}) 
export class DialogResult { 
    selectedOption: string; 

    constructor(public dialog: MdDialog) {} 

    openDialog() { 
    let dialogRef = this.dialog.open(Dialog); 
    dialogRef.afterClosed().subscribe(result => { 
     this.selectedOption = result; 
    }); 
    } 
} 


@Component({ 
    selector: 'dialog', 
    templateUrl: './dialog.html', 
}) 
export class Dialog { 
    constructor(public dialogRef: MdDialogRef<Dialog>) {} 
} 

我想使对话框拖动或移动使用鼠标，以便我还可以看到我的页面内容。

Answer 1

我正在使用Draggabilly库。

打开时一个对话单元，通过在选项的服装 'panelClass'：在对话单元

let dialogRef = this.dialog.open(Dialog, { 
    panelClass: 'dialog-container' 
}); 

然后，初始draggablilly ngOnInit钩：上拖动库

const holder = new draggablilly('.dialog-container');