2015-01-05 32 views
9

Tôi đang cố gắng hiển thị phương thức khi lượt xem được tải.Lỗi loại: Không thể đọc thuộc tính 'childNodes' không xác định

Code:

//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"); 
} 
}]) 

Tất cả mọi thứ hoạt động tốt và các phương thức được hiển thị nhưng tôi nhận được lỗi này trên console:

Type error : Cannot read property 'childNodes' of undefined 

Tôi không có ý tưởng tại sao điều này đang xảy ra. Ngoài ra nếu tôi xóa "biểu mẫu" khỏi phương thức, tôi không nhận được bất kỳ lỗi nào. Vì vậy, tôi đoán vấn đề là với các hình thức nhưng tôi không thể giải quyết nó.

Xin cảm ơn trước.

+0

bạn có bao gồm 'jQuery' không? Bạn đang sử dụng bộ chọn '$ ('# companyModal')' để chọn một phần tử với 'jQuery'. –

+0

@MohitPandey .. Có tôi bao gồm jquery – Zee

+0

Rất khó để theo dõi lỗi với mã này. Hãy thử tạo một http://jsfiddle.net/ của nó. Ngoài ra, bên trong bộ điều khiển '$' là một tham chiếu của góc không phải jQuery. Hãy thử sử dụng 'jQuery ('# companyModal')'. –

Trả lời

2

Xin lỗi vì đã chỉnh sửa. HTML của bạn có được định dạng tốt không? Kiểm tra xem tất cả các thẻ có khớp không.

Trong đoạn mã của bạn, có vẻ như bạn đang thiếu một div đóng. kiểm tra rằng - một trong đó đóng div điều khiển.

39

Tôi đã gặp vấn đề tương tự và tôi đã giải quyết được vấn đề bằng cách gói hàm mở phương thức bên trong hàm timeout $() hoặc hàm setTimeout() bình thường.

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

Vấn đề setTimeout() này luôn có trong Javascript. Tôi đã phải đối mặt với điều này rất nhiều lần. Dù sao, tôi bắt đầu từ đầu một lần nữa và bây giờ nó làm việc cho tôi, mà không có chức năng timeout. – Zee

+1

Đã cứu mạng tôi! Điều này sẽ được đánh dấu là được chấp nhận. – lbarman

11

Tôi đã có thông báo lỗi tương tự khi cố sử dụng plugin JQuery. Chạy nó sau khi tài liệu đã sẵn sàng giải quyết vấn đề cho tôi. Plugin đã chạy tốt nhưng mã góc theo sau trong phạm vi hiện tại thì không.

Đó là "Đặt thời gian chờ" -answer trong chuỗi này đã khiến tôi thử giải pháp này.

Giải pháp cho tôi:

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

Tôi đã có một vấn đề tương tự. Nó sẽ ném một ngoại lệ khi tôi đã cố gắng để thêm một số html để dom và biên dịch nó bằng cách sử dụng $ biên dịch trong angularJs.

enter image description here

Bên trong html là một chỉ thị rằng cố gắng thêm một số yếu tố dom từ trang để ở một nơi khác trong trang.

Tôi chỉ cần gọi .clone của phần tử đó trước khi tôi chuyển nó đến vị trí mới. Và ngoại lệ đã biến mất.

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

Như một giải pháp trong bối cảnh AngularJS Tôi đang sử dụng phương pháp này:

  1. Bao gồm $timeout mô-đun điều khiển trong JS của bạn
  2. Run init() chức năng với tất cả initializers như thế này:

    $ timeout (init, 0);

Làm việc tốt.

Các vấn đề liên quan