Javascript AngularJS自定义指令编译转包

我正在尝试编写一个指令，将其子元素包装在中，然后根据其内容是否溢出，向添加/删除样式。问题是，我尝试的不同方法破坏了具有我编写的另一个自定义指令的children元素

这样做的目的是设计丑陋的webkit滚动条的样式，它可以在不改变本机滚动行为的情况下更改我的布局

以下是子元素的自定义指令：

function fgDrawers($swipe, $timeout) {
    var directive = {
        controller: 'InboxController',
        // controllerAs: 'vm',
        // bindToController: true,
        // restrict: 'A',
        link: linkFunc
    };

    return directive;

    function linkFunc(scope, $wrapper, attr) {
        $wrapper.addClass('fg-drawers');
        // elements
        var $content = $wrapper.children('[fg-content]');
        var $drawerLeft = $wrapper.children('[fg-drawer=left]');
        var $drawerRight = $wrapper.children('[fg-drawer=right]');
        var $divider = $wrapper.children('[fg-divider]');

        // positions
        var restX = 0;
        var dragStartX;
        var deltaX;
        var relativeX;
        var snapLeftX = $content[0].offsetWidth;
        var thresholdLeft = snapLeftX / 3;
        var snapRightX = -73;
        var thresholdRight = snapRightX / 2;

        // states

        $swipe.bind($content, {
            start: function (pos, e) {
                dragStartX = pos.x;
            },
            move: function (pos, e) {
                deltaX = pos.x - dragStartX + restX;

                if (deltaX >= 0) {
                    $drawerLeft.css({
                        'zIndex': 2
                    });
                } else {
                    $drawerLeft.css({
                        'zIndex': 0
                    });
                }

                $content.css({
                    '-webkit-transform': 'translateX(' + deltaX + 'px)',
                    'transform': 'translateX(' + deltaX + 'px)'
                });
            },
            end: function (pos, e) {
                animateSnap();
                if (deltaX > 0 && deltaX > thresholdLeft) {
                    $content.css({
                        '-webkit-transform': 'translateX(' + snapLeftX + 'px)',
                        'transform': 'translateX(' + snapLeftX + 'px)'
                    });
                    restX = snapLeftX;
                    scope.vm.deliverTicket(scope.ticket).done(function (res) {
                        console.log('', res);
                    });
                } else if (deltaX < 0 && deltaX < thresholdRight) {
                    $content.css({
                        '-webkit-transform': 'translateX(' + snapRightX + 'px)',
                        'transform': 'translateX(' + snapRightX + 'px)'
                    });
                    restX = snapRightX;
                } else {
                    $content.css({
                        '-webkit-transform': 'translateX(0)',
                        'transform': 'translateX(0)'
                    });
                    restX = 0;
                }
            },
            cancel: function (e) {
                animateSnap();
                $content.css({
                    '-webkit-transform': 'translateX(0)',
                    'transform': 'translateX(0)'
                });
                restX = 0;
            }
        });

        function animateSnap() {
            $content.addClass('snap-transition');
            $timeout(function () {
                $content.removeClass('snap-transition');
            }, 250);
        }
    }

fgDrawers函数（$swipe，$timeout）{
var指令={
控制器：“InboxController”，
//controllerAs:'vm'，
//bindToController：对，
//限制：“A”，
链接：linkFunc
};
返回指令；
函数linkFunc（作用域，$wrapper，attr）{
$wrapper.addClass（'fg-drawers'）；
//元素
var$content=$wrapper.children（“[fg content]”）；
var$drawerLeft=$wrapper.children（“[fg drawer=left]”）；
var$drawerRight=$wrapper.children（“[fg drawer=right]”）；
var$divider=$wrapper.children（“[fg divider]”）；
//职位
var-restX=0；
var dragStartX；
增值税；
相对风险价值；
var snapLeftX=$content[0]。offsetWidth；
var thresholdLeft=snapLeftX/3；
var snapRightX=-73；
var thresholdRight=snapRightX/2；
//州
$swipe.bind（$content{
启动：功能（位置e）{
dragStartX=位置x；
},
移动：功能（位置，e）{
deltaX=位置x-dragStartX+restX；
如果（deltaX>=0）{
$drawerLeft.css({
“zIndex”：2
});
}否则{
$drawerLeft.css({
“zIndex”：0
});
}
$content.css({
“-webkit transform”：“translateX（“+deltaX+”px）”，
“transform”：“translateX（'+deltaX+'px）”
});
},
结束：功能（位置e）{
动画捕捉（）；
如果（deltaX>0&&deltaX>thresholdLeft）{
$content.css({
“-webkit transform”：“translateX（”+snapLeftX+“px）”，
“transform”：“translateX（'+snapLeftX+'px）”
});
restX=snapLeftX；
scope.vm.deliverTicket（scope.ticket）.done（函数（res）{
控制台日志（“”，res）；
});
}else if（deltaX<0&&deltaX