Question

我已经创建了一个指令，它将动画PNG序列，当我在图像网址中进行硬编码时，一切都运行正常，但是当我尝试传递动态网址时，我得到一个错误，即$ sce不允许它。< / p>

这是我的指令代码：

module.exports = function () {
    return {
        restrict : 'E',
        scope: {
            height: '@height',
            frames : '@frameCount',
            src : '@src',
            width : '@width'
        },
        link : function (scope, element) {
            var currentPosition = 0;
            var i = 1;
            var fps = 1000 / 30; // Setting this to 30 frames per second.
            element.css({
                backgroundImage : 'url(' + scope.src +')',
                height : scope.height + 'px',
                width : scope.width + 'px'
            });
            setInterval(function () {
                if(i < scope.frames) {
                    currentPosition = currentPosition + (parseInt(scope.height));
                    element.css('background-position-y', '-' + (currentPosition) + 'px');
                    i++;
                }
            }, fps);
        }
    }

接下来在我看来，我添加了指令：

<png-sequencer src='assets/images/png-sequences/{{user.segment}}_{{user.condition}}.png' frame-count='12' height='37' width='64'></png-sequencer>

但是我收到以下错误：

angular.js：13236错误：[$ interpolate：noconcat]插值时出错：assets / images / png-sequences / {{user.segment}} _ {{user.condition}}。png 严格上下文转义不允许在需要可信值时连接多个表达式的插值。

如果我用硬编码值替换src，例如＆＃34; assets / images / png-sequences / day_rainy.png＆＃34;然后一切正常。我需要做什么才能允许动态src？

Answer 1

问题是src是一个保留字，改为pngSrc修复了这个问题。

Angular.js问题$ sce阻止我将我想要的内容传递给我的指令

1 个答案: