0
我有一個自定義輸入指令，它將每個新元素作爲標籤添加到先前輸入的項目列表中。而且我的代碼在所有瀏覽器（Chrome，Safari，Firefox，Edge）中都能正常工作，我的問題是IE11及更低版本。一旦輸入字段被選中，我似乎無法清除佔位符文本。在IE問題上的角度佔位符
我不太確定該怎麼做..或如何修改，以便它在IE中表現很好。
main.html中
<tagged disabled="{{ canNotEdit }" property="newProfile.educationSubjects" placeholder="{{ 'newVacancy.educationFieldsPlaceholder' | translate }}">
</tagged>
tagged.html
<div ng-class="{'element-disabled': disabled }" class="position-relative">
<div class="position-relative">
<input type="text"
ng-disabled="{{ disabled }}"
class="inpt"
placeholder="{{ placeholder }}">
<span class="caret">
<svg class="caret-icon">
<use xlink:href="images/svg-generated/svg/symbols.svg#add-s">
</use>
</svg>
</span>
<div>
<div class="taglist list-inline">
<ul>
<li class="tag"
ng-click="removeItem($index)"
ng-repeat="item in dataArray track by $index">
{{ item }}
<svg class="tag-close">
<use xlink:href="images/svg-generated/svg/symbols.svg#remove"></use>
</svg>
</li>
</ul>
</div>
</div>
</div>
</div>
和我的指令控制器：
標記過dir.js
'use strict';
export default function() {
return {
restrict: 'E',
scope: {
dataArray: '=property',
disabled: '@',
placeholder: '@'
},
templateUrl: '..path-to/tagged.html',
link: function(scope, element) {
var input = angular.element(element.find('input')[0]);
var button = angular.element(element.find('span')[0]);
scope.removeItem = function(index) {
if(scope.disabled === 'true') {
return false;
}
scope.dataArray.splice(index, 1);
};
function addTag() {
let val = input.val().replace(/\/|\\/g, '');
if(!val) {
return;
}
scope.dataArray.push(val);
scope.$digest();
input.val('');
}
input.bind('keydown keypress', function(event) {
if(event.which === 13 && scope.disabled !== 'true') {
event.preventDefault();
addTag();
}
});
input.bind('mouseenter', function() {
if(scope.disabled === 'true') {
return false;
}
element.addClass('taglist-hovered');
});
input.bind('mouseleave', function() {
if(scope.disabled === 'true') {
return false;
}
element.removeClass('taglist-hovered');
});
input.bind('focus', function() {
if(scope.disabled === 'true') {
return false;
}
element.addClass('taglist-focused');
});
input.bind('blur', function() {
if(scope.disabled === 'true') {
return false;
}
element.removeClass('taglist-focused');
});
button.on('click', function(event) {
if(scope.disabled === 'true') {
return false;
}
addTag();
});
}
};
};