Question

我正在构建一个AngularJS应用程序（版本：1.4.10），最近我发现只有在Safari中应用程序不起作用。

我得到的错误如下：

[Error] SyntaxError: Unexpected token '<'    (anonymous function) (angular-slide.js:1)
[Error] SyntaxError: Unexpected token '>'    (anonymous function) (landing.js:132)
Error: [$injector:modulerr] Failed to instantiate module myApp due to:
[$injector:modulerr] Failed to instantiate module myApp.landing due to:
[$injector:nomod] Module 'myApp.landing' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. (angular.js:4496)

这仅在Safari中发生。在Firefox和Chrome中，我只从控制台收到此消息：

angular-slide.js:1 Uncaught SyntaxError: Unexpected token <

landing.js的第132行如下：

 scope.$watch(attrs.slider, (n, o) => {

该指令的整个代码如下：

}]).directive('slider', function () {
    return {
        restrict:'A',
        compile: function (element) {
            // wrap tag
            var contents = element.html();
            element.html('<div class="slideable_content" style=" margin:0 !important; padding:0 !important; height: 300px;" >' + contents + '</div>');

            return function postLink(scope, element, attrs) {
                var i = 0;
                // default properties
                scope.$watch(attrs.slider, (n, o) => {
                    if (n !== o) {
                        i++;
                        var target = element[0],
                            content = target.querySelector('.slideable_content');
                        if(n) {
                            content.style.border = '1px solid rgba(0,0,0,0)';
                            var y = content.clientHeight, z = i;
                            content.style.border = 0;
                            target.style.height = y + 'px';
                            setTimeout(() => {
                                if (z === i) {
                                    target.style.height = 'auto';
                                }
                            }, 500);
                        } else {
                            target.style.height = target.clientHeight + 'px';
                            setTimeout(() => {
                                target.style.height = '0px';
                            });
                        }
                    }
                });

                attrs.duration = (!attrs.duration) ? '0.5s' : attrs.duration;
                attrs.easing = (!attrs.easing) ? 'ease-in-out' : attrs.easing;
                element.css({
                    'overflow': 'hidden',
                    'height': '0px',
                    'transitionProperty': 'height',
                    'transitionDuration': attrs.duration,
                    'transitionTimingFunction': attrs.easing
                });
            };
        }
    };
});

如何使此指令符合Safari并修复错误？

Answer 1

[大多数]浏览器还不支持es6 lambda。您需要使用Babel等工具将es6转换为es5。

换句话说，等同于(n, o) => {...}的es5是function(n, o) {...}。

AngularJS：仅在Safari中加载模块失败

1 个答案: