未在 IE 11 中获取属性值答案

【问题标题】：Not getting attribute value in IE 11未在 IE 11 中获取属性值
【发布时间】：2017-10-22 09:15:14
【问题描述】：

我有一个自定义指令“customDir”和一个属性“headerwidth”。以下代码在 chrome、safari 和 firefox 中完美运行。但是在IE中没有获取到属性值。

HTML

<custom-dir headerwidth="headerWidth" gfilter="__filter" pidx="$parent.$index" cidx="$index" config="gantt_config" v4data="v4.gantt_data"></custom-dir>

JS 代码

.controller("myCtrl", function($scope) {
    $scope.headerWidth = 'test';
})
.directive('customDir', function ($compile) {
    return {
        restrict: 'EA',
        scope: {
            headerwidth: "=",
            gfilter: "=",
            pidx: "=",
            cidx: "=",
            config: "=",
            v4data: "="
        },
        link: function (scope, element, attrs) {

            scope.$watch('gfilter', function () {
                renderTemplate();
            }, true);

            let getX = function (y1) {
                return scope.headerwidth * (y1 - scope.gfilter.fromYear) + (3 * (y1 - scope.gfilter.fromYear));
            };

            let getWidth = function (y1, y2) {
                return ((scope.headerwidth * (y1 - y2)) + 84 + 34);
            };

            var currentElement = element;
            let renderTemplate = function () {
                let rectLine = '';
                if (scope.v4data[scope.config.sY_field] && scope.v4data[scope.config.eY_field]) {
                    let __X = getX(scope.v4data[scope.config.sY_field]['year']);
                    let __W = getWidth(scope.v4data[scope.config.eY_field]['year'], scope.v4data[scope.config.sY_field]['year']);

                    rectLine = '<rect x="' + __X + '" y="6" width="' + __W + '" height="8" fill="#cacaca" />';
                }

                let html = '<svg xmlns="http://www.w3.org/2000/svg" height="18px" width="100%">\
                    <g id="g_'+ scope.pidx + '_' + scope.cidx + '">\
                        '+ rectLine + '\
                    </g>\
                </svg>';

                var replacementElement = $compile(html)(scope);
                currentElement.replaceWith(replacementElement);
                currentElement = replacementElement;
            };

            renderTemplate();
        }
    };
})

【问题讨论】：

您的控制器设置为headerWidth。你的指令定义了headerwidth。这些是不同的名称。
@MikeMcCaughan 我更新了代码.. 请再检查一次。上面的代码在 chrome、safari 和 mozilla bt 中运行良好我只在 IE 11 中遇到问题
@MikeMcCaughan 你能用你当地的 IE11 查看我的回答中的例子吗？我确认它正在工作，但 OP 说它不起作用，这听起来是有线的。
另外，您将headerWidth 定义为字符串。一般来说，将一个字符串乘以一个数字不会让你走得太远......
该代码不在问题范围内。请删除此问题；任何人都无法使用您共享的代码来回答它。

标签： angularjs internet-explorer angularjs-directive ie11-developer-tools

【解决方案1】：

<custom-dir headerwidth="{{headerWidth}}" gfilter="__filter" pidx="$parent.$index" cidx="$index" config="gantt_config" v4data="v4.gantt_data"></custom-dir>

【讨论】：