angular 解决placeholder兼容问题

//模拟ie不兼容问题

.directive('inputs', ['$compile', function($compile){
return {
restrict: 'ECMA',
scope: {},
link: function(scope, ele, attr) {
console.log(ele.context);
console.log(scope);
var input = document.createElement('input');
var isSupportPlaceholder = 'placeholder' in input;
if (!isSupportPlaceholder) {
var fakePlaceholder = angular.element(
'<span class="plcaeholder" style="position:absolute;margin:10px 0 0 10px;color:#666">' +attr['placeholder'] + '</span>');
fakePlaceholder.on('click', function(e){
e.stopPropagation();
ele.focus();
});
ele.before(fakePlaceholder);
scope.hasValue = function(){
return ele.val();
};
scope.$watch(scope.hasValue, function(){
if (ele.val()) {
fakePlaceholder.hide();
}
});
$compile(fakePlaceholder)(scope);
ele.on('focus', function(){
console.log(1111)
fakePlaceholder.hide();
}).on('blur', function(){
if (ele.val() === '') {
fakePlaceholder.show();
}
});
}
}
};
}]);

转载于:https://www.cnblogs.com/csw1364115877/p/6703607.html