Angular2 scroll滚动条事件监听多级联动，scroll固定一列移动多列

scroll绑定div实现固定一列和移动多列

最左边顶部是固定的，右上角可以左右滚动，左下角可以上下滚动，右下角是上下左右都可以滚动。
多级联动是指：右下角区块向左或右移动，右上角区块跟着移动，向上或向下移动时，左下角区块也跟着移动，右上角和左下角移动时互斥的。

"container">
        
"top">
            
"leftTop">leftTop
            
"head" class="rightTop" (scroll)="noscroll($event)" *ngFor="let data of datas">{{data}}
        
        
"bottom">
            
"left" class="leftBottom" (scroll)="noscroll($event)" *ngFor="let data of datas">{{data}}
            
"right" class="rightBottom" (scroll)="scroll($event)" *ngFor="let data of datas">{{data}}
        



----------


**TS文件**

public scroll(event){
console.log(event);
            document.getElementById("head")._scrollContent.nativeElement.scrollLeft = document.getElementById("right")._scrollContent.nativeElement.scrollLeft;
            document.getElementById("left")._scrollContent.nativeElement.scrollTop = document.getElementById("right")._scrollContent.nativeElement.scrollTop;
}

//移动右边时固定左边和上边
public noscroll(event){
console.log(event);
            document.getElementById("right")._scrollContent.nativeElement.scrollLeft = document.getElementById("head")._scrollContent.nativeElement.scrollLeft;
                document.getElementById("right")._scrollContent.nativeElement.scrollTop = document.getElementById("left")._scrollContent.nativeElement.scrollTop;
}