声明变量

Question

有什么办法可以用不同的方式声明url变量吗？ 因为它不适用于我的代码。 我从这里找到了这段代码。但它对这个小提琴工作正常 - http://jsfiddle.net/jaimem/aSjwk/1/

 app.directive('backImg',  function(){
    // Runs during compile
    return {
        // name: '',
        // priority: 1,
        // terminal: true,
        // scope: {}, // {} = isolate, true = child, false/undefined = no change
        // controller: function($scope, $element, $attrs, $transclude) {},
        // require: 'ngModel', // Array = multiple requires, ? = optional, ^ = check parent elements
        // restrict: 'A', // E = Element, A = Attribute, C = Class, M = Comment
        // template: '',
        // templateUrl: '',
        // replace: true,
        // transclude: true,
        // compile: function(tElement, tAttrs, function transclude(function(scope, cloneLinkingFn){ return function linking(scope, elm, attrs){}})),
        link: function($scope, element, attrs) {
            var url = attrs.backImg;
            element.css({
                'background-image': 'url(' + url +')',
                'background-size' : 'cover'
            });
            console.log(url)
        }
    };
});

HTML

<div  back-img='{{el.images}}.png'></div>

Answer 1

将CSS属性设置为URL值时，必须将URL包装在引号中。

试试这个。

element.css({
         'background-image': 'url("' + url +'")',
         'background-size' : 'cover'
});

Answer 2

您的url似乎应该surl，因为您将backIng值放入surl。

尝试改变它。

var turl = element.css({
            'background-image': 'url(' + surl +')',
            'background-size' : 'cover'
        });