Javascript 在“两个角度材质”选项卡之间拖放

我有两个带角材质选项卡（md选项卡）的单独div。使用library，我试图将内容（按钮）从一个选项卡拖到另一个选项卡。但在拖动时，按钮会随着相同的div移动。即，按钮到达边界后隐藏（溢出）

如果我尝试对普通div做同样的操作，它工作得很好

我试图更改按钮的位置和z索引，但它没有正常工作

代码详细信息如下

angular.module（'MyApp'，['ngMaterial'，'ngMessages'，'material.svgAssetsCache'，'ngDragDrop']））
.controller（'AppCtrl'，函数（$scope）{
$scope.list1={
标题：“md选项卡-Dragd me”
};
$scope.list2={}；
$scope.list3={
标题：“拖拽我”
};
$scope.list4={}；
});
.tabsdemodynamic内容{
背景色：透明！重要；}
.tabsDemodDynamicHeight md内容md选项卡{
背景：#f6f6f6；
边框：1px实心#e1e1；}
.tabsDemodDynamicHeight md内容md选项卡md选项卡包装器{
背景：白色；}
.tabsDemodDynamicHeight md内容h1：第一个孩子{
页边距顶部：0；}
#md-tab1{
宽度：400px；
填充：25px；
边框：1px点蓝色；
}
#md-tab2{
宽度：400px；
填充：25px；
边框：1px点红色；
}
.缩略图{高度：280px！重要；}
.btn可拖放{宽度：180px；高度：30px；左侧填充：4px；}
.btn可拖动{宽度：160px；}
.emage{高度：215px；}
美国医学博士{
溢出：隐藏；
}
/*#btn1{
显示：固定！重要；
z指数：9999；
}*/

使用md选项卡
表一
将按钮移动到下一个选项卡

{{list1.title}
表二
{{list2.title}
不带md标签
将按钮移动到下一个选项卡

{{list3.title}
表二
{{list4.title}
这是css问题，请尝试添加

  ._md, md-tab-content #md-tab1 .md-no-scroll,#md-tab1 md-tabs,md-tab-content.md-no-scroll {
   overflow: visible !important;
  }

  #md-tab2 md-tab-content,#md-tab2 md-tabs-content-wrapper,md-tabs.md-dynamic-height md-tabs-content-wrapper {
   z-index: 1;
  }

谢谢你对阿卜杜勒的支持。没有滚动条，您的修复程序工作正常。当我将scroll应用于md标签内容包装标签（css:height:200px；overflow-x:hidden；overflow-y:scroll）时，我再次面临同样的问题。你可以参考这个链接：我接受了你的答案阿卜杜勒。你能帮我解决卷轴问题吗？在你的aboce代码笔中，我没有找到任何卷轴代码，你能创建一个你正在尝试使用卷轴的代码笔吗？Abdul，现在你可以检查链接了。感谢您的支持。非常简单：只需在draggable:
data jqyoui options=“{revert:'invalid'，helper:'clone'，scroll:false，appendTo:'body'}”中替换此选项即可。