自定义角度指令在IE11中不起作用

时间:2015-06-11 18:19:09

标签: javascript angularjs web web-applications

我有一个指令,用于在完成调查时显示用户进度。以下是指令:

.directive('progressBar', [function () {
  return {
    templateUrl: 'survey/survey.progressBar.tpl.html',
    replace: true,
    restrict: 'E',
    scope: {
      currentPage: '=',
      totalPages: '='
    },
    link: function ($scope, iElement, iAttrs) {
      $scope.getProgress = function() {
        var toReturn = Math.ceil(($scope.currentPage/$scope.totalPages)*100);
        if (isNaN(toReturn)) {
          return 0;
        }
        return toReturn;
      };
    }
  };
}]);

下面是调用此指令的表达式:

<div class="progress-bar-container">
  <div class="progress-bar" style="width:{{ getProgress() }}%;" ng-style="width:{{ getProgress() }}%;">
    <div class="tooltip arrow-up">
      <span>{{ getProgress() }}% <span translate="SURVEY.COMPLETE"></span></span>
    </div>
  </div>
</div>

当用户在Firefox,Safari和Chrome上完成调查时,两个代码段都会显示进度条和完成百分比...很遗憾,它无法在IE 10或11上运行。

任何人都有任何想法可能会破坏Internet Explorer吗?

1 个答案:

答案 0 :(得分:2)

Navaneeth,对延迟回应道歉。我设法解决了以下问题:

angular.module('myApp')
    .filter('filterWithOr', function ($filter) {
      var comparator = function (actual, expected) {
        if (angular.isUndefined(actual)) {
          // No substring matching against `undefined`
          return false;
        }
        if ((actual === null) || (expected === null)) {
          // No substring matching against `null`; only match against `null`
          return actual === expected;
        }
        if ((angular.isObject(expected) && !angular.isArray(expected)) || (angular.isObject(actual) && !hasCustomToString(actual))) {
          // Should not compare primitives against objects, unless they have custom `toString` method
          return false;
        }
        console.log('ACTUAL EXPECTED')
        console.log(actual)
        console.log(expected)

        actual = angular.lowercase('' + actual);
        if (angular.isArray(expected)) {
          var match = false;
          expected.forEach(function (e) {
            console.log('forEach')
            console.log(e)
            e = angular.lowercase('' + e);
            if (actual.indexOf(e) !== -1) {
              match = true;
            }
          });
          return match;
        } else {
          expected = angular.lowercase('' + expected);
          return actual.indexOf(expected) !== -1;
        }
      };
      return function (array, expression) {
        return $filter('filter')(array, expression, comparator);
      };
    });
据称IE11没有呈现内联样式标签,我只需要使用Angular&#34; ng-style&#34;表达,一切都解决了。