[AngularJS]Angular.js $compile 不工作

发布时间: 2017/4/16 21:29:42
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我试着将项目中的所有输入的类型日期更改为 uib 选取器弹出,我使用指令和 $compile 但新元素不起作用。当我把结果 html 到新.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>

这里的呆瓜

谢谢你的帮助 !

解决方法 1:

只将其包装和它的作品︰

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));

http://plnkr.co/edit/JPSpVyWgDJeC0NtNhnib?p=preview

官方微信
官方QQ群
31647020