Angular.js $compile 不工作
Angular.js $compile doesn`t working
我尝试将项目中的所有输入类型日期更改为 uib-picker-popup,我使用指令和 $compile 但新元素不起作用。当我将结果 html 放入 new .html 时它工作正常,我猜 $compile.
有问题
来源html
<input type="date" ng-model="picker" />
指令
angular.module('ui.bootstrap.demo').directive('input', function ($compile) {
return {
require: 'ngModel',
compile: function (tElem, tAttr) {
if (tAttr.type !== 'date') {
return;
}
return function (scope, elm, attrs, ngModelCtrl) {
var ngModel = elm.attr('ng-model');
var name = elm.attr('name');
var className = elm.attr('class');
var newElement = '<input type="text" class="' + className + '" ng-model="' + ngModel + '" name="' + name + '" uib-datepicker-popup is-open="isOpen">' +
'<button type="button" class="btn btn-primary" ng-click="isOpen = true">+</button>';
elm.replaceWith($compile(newElement)(scope));
};
}
};
});
结果html
<input type="text" class="ng-pristine ng-valid ng-scope ng-isolate-scope ng-valid-date ng-touched" ng-model="picker" name="undefined" uib-datepicker-popup="" is-open="isOpen" style="">
<button type="button" class="btn btn-primary ng-scope" ng-click="isOpen = true">+</button>
感谢帮助!
只要包裹起来就可以了:
var newElement = '<div><input type="text" class="' + className + '" ng-model="' + ngModel + '" name="' + name + '" uib-datepicker-popup is-open="isOpen">' +
'<button type="button" class="btn btn-primary" ng-click="isOpen = true">+</button></div>';
elm.replaceWith($compile(newElement)(scope));
我尝试将项目中的所有输入类型日期更改为 uib-picker-popup,我使用指令和 $compile 但新元素不起作用。当我将结果 html 放入 new .html 时它工作正常,我猜 $compile.
有问题来源html
<input type="date" ng-model="picker" />
指令
angular.module('ui.bootstrap.demo').directive('input', function ($compile) {
return {
require: 'ngModel',
compile: function (tElem, tAttr) {
if (tAttr.type !== 'date') {
return;
}
return function (scope, elm, attrs, ngModelCtrl) {
var ngModel = elm.attr('ng-model');
var name = elm.attr('name');
var className = elm.attr('class');
var newElement = '<input type="text" class="' + className + '" ng-model="' + ngModel + '" name="' + name + '" uib-datepicker-popup is-open="isOpen">' +
'<button type="button" class="btn btn-primary" ng-click="isOpen = true">+</button>';
elm.replaceWith($compile(newElement)(scope));
};
}
};
});
结果html
<input type="text" class="ng-pristine ng-valid ng-scope ng-isolate-scope ng-valid-date ng-touched" ng-model="picker" name="undefined" uib-datepicker-popup="" is-open="isOpen" style="">
<button type="button" class="btn btn-primary ng-scope" ng-click="isOpen = true">+</button>
感谢帮助!
只要包裹起来就可以了:
var newElement = '<div><input type="text" class="' + className + '" ng-model="' + ngModel + '" name="' + name + '" uib-datepicker-popup is-open="isOpen">' +
'<button type="button" class="btn btn-primary" ng-click="isOpen = true">+</button></div>';
elm.replaceWith($compile(newElement)(scope));