我有一个指令,用于在完成调查时显示用户进度。以下是指令:
.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吗?
答案 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;表达,一切都解决了。