解决ionic的side-menus与range的冲突的问题

最近用ionic1开发webAPP遇到了这样一个问题：
这个app我是用了side-menus（侧滑菜单），同时在content里我又用到了range（滑块）
结果就尴尬了。。两个侧滑事件起了冲突，请看尬图

之后google找到如下代码，放到项目结果就没有冲突了

(function() {"use strict";

    angular
        .module('MyApp.Directives.range', [])
        .directive('range', rangeDirective);

function rangeDirective() {
    return {
        restrict: 'C',
        link: function (scope, element, attr) {
            element.bind('touchstart mousedown', function(event) {
                event.stopPropagation();
                event.stopImmediatePropagation();
            });
        }
    };
 }
})();

解决后的样子：