使用ps-container时的ng-pageslider

Question

我在我的项目中实现了ng-pageslide directive。当我允许其默认行为并允许它附加到body标签时，它在Chrome中运行良好。但是，对于使用UI Bootstrap tabs的页面，它会导致Firefox中的布局问题。它基本上把一切都转移到了右边。

ng-pageslide添加到body标签的样式是：

position: absolute; transition-duration: 0.5s; transition-property: top, bottom, left, right; right: 0px;

我尝试在转换到不使用pageslide的页面时手动删除这些内容，但这似乎是一个糟糕的解决方案。

我也尝试过使用ps-container属性并构建我的HTML：

<div id="tasks">
    <!-- table using ng-repeat -->
    <pageslide ps-open="project.sidebar" ps-auto-close="true" ps-squeeze="true" ps-body-class="true" ps-container="tasks">
</div>

此HTML模板由ui-tabset使用：

包含

<uib-tabset justified="true">
    <uib-tab ng-repeat="tab in project.tabs" active="tab.active" select="$state.go(tab.route)" disable="tab.disabled">
        <uib-tab-heading>
            <i class="fa fa-{{tab.icon}}"></i>
            <span translate="{{tab.titleKey}}">{{tab.title}}</span>
        </uib-tab-heading>
        <div ng-include="tab.content" class="m-t-sm"></div>
    </uib-tab>
</uib-tabset>

当我使用此设置时，我遇到两个问题：

1. 该表最初被压缩到页面的右侧。
2. 当我打开页面滑块时，它从右侧滑过300px，最后覆盖我的桌子，而不是挤压它。
3. 滑出的面板似乎切断了其内容。我注意到我可以通过将style="height: 100%"添加到“tasks”元素来解决这个问题。

截图：



我需要做些什么来使ps-container工作，比如将bodylide添加到body标签？