输入错误:无法读取属性' childNodes'未定义的

时间:2015-01-05 09:00:52

标签: angularjs twitter-bootstrap

我正在尝试在加载视图时显示模态。

代码:

//View
<div id="showCom" ng-controller="showmodalCtrl" ng-init="init()">

<div class="modal fade" id="companyModal" role="dialog">
 <div class="modal-dialog">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      <h4 class="modal-title">Please Select Company</h4>
    </div>
    <div class="modal-body">
     <form>
      <div class="form-group">
        <label class="control-label">Recipient:</label>
        <input type="text" class="form-control">
      </div>
     </form>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-primary">Submit</button>
    </div>
  </div>
 </div>
</div>

//Controller
 .controller('showmodalCtrl', ['$scope', function($scope){

$scope.init = function(){
  $('#companyModal').modal("show");
}
 }])

一切正常并且显示模态但我在控制台上收到此错误:

Type error : Cannot read property 'childNodes' of undefined

我不知道为什么会这样。 如果我删除&#34;表格&#34;从模态中,我没有得到任何错误。所以我猜问题是表单,但我无法解决它。

提前致谢。

5 个答案:

答案 0 :(得分:47)

我遇到了同样的问题,我设法通过将模态打开函数包装在$ timeout()或普通的setTimeout()函数中来解决它。

setTimeout(function(){
   jQuery('#messageModal').modal('show');
}, 0);

答案 1 :(得分:14)

尝试使用JQuery插件时,我遇到了同样的错误消息。文档就绪后运行它为我解决了问题。该插件运行正常,但当前范围内的角度代码不是。

这个线程中的&#34; Set timeout&#34; -answer让我尝试了这个解决方案。

我的解决方案:

angular.element(document).ready(function () {
    //Angular breaks if this is done earlier than document ready.
    setupSliderPlugin();
});

答案 2 :(得分:4)

作为AngularJS上下文中的另一个解决方案,我使用这种方法:

  1. 在JS控制器中包含$timeout模块
  2. 使用所有初始化程序运行init()函数,如下所示:
      

    $ timeout(init,0);

  3. 效果很好。

答案 3 :(得分:2)

抱歉编辑。你的HTML格式正确吗?检查所有标签是否匹配。

在您的代码段中,您似乎错过了结束div。检查 - 关闭控制器div的那个。

答案 4 :(得分:2)

我有类似的问题。当我试图将一些html添加到dom并使用angularJs中的$ compile编译它时会抛出异常。

enter image description here

html内部是另一个试图将页面中的dom元素添加到页面其他位置的指令。

在将其移动到新位置之前,我只需要调用该元素的.clone。 异常消失了。

$popupContent = $(attrs.popupSelector).clone();
$container = $('<div class="popup-container"></div>');
$container.append($popupContent);
$container.hide();
$('body').append($container);