2017-06-30 32 views
6

Verileri içe aktarma hatalarım gösteren sahte bir rapor oluşturmaya çalışıyorum. Bunu yapmak için iki işlevi vardır:IE 11, dinamik olarak oluşturulmuş html sayfaları için appendChild() öğesini göz ardı ediyor

   let createHtmlErrorReport = (err) => { 

        let currentDate = new Date().toLocaleString(); 
        let contents = '<!DOCTYPE html> ' + 
         '<html>' + 
         '<head>' + 
         '<title>Import Inventory Import</title>' + 
         '<meta charset="utf-8" />' + 
         '<meta http-equiv="Content-Language" content="en">' + 
         '<style type="text/css">' + 
         ' html { margin:0; }' + 
         ' body { background-color:#d6d6d6; font: 10pt sans-serif;}' + 
         'ul li{ padding: 3px; font:12pt;}'+ 
         ' #header {padding:10px; background-color:#007fcc; color:#ffffff; } ' + 
         '</style>' + 
         '</head>' + 
         '<body>' + 
         '<div id="header">'+ 
         '<strong>Import Inventory Import</strong>' + 
         '</div>' + 
         '<p><strong>Imported ' + currentDate + ' by ' + err.username + ' | ' + err.unprocessedItemsCount + ' items not imported | ' + err.processedItemsCount + ' items imported | '+ err.errorMessages.length + ' errors.</strong></p>'+ 
         '<p>The following errors occured during import: </p>'+ 
         '<div id="errorList" style="padding:5px;"></div>'+ 
         '</body>' + 
         '</html>'; 
        return contents; 

       } 

Ben yeni bir belge oluşturmak için yukarıdaki olarak, bazı temel stil ekleyebilir ve sonra hataların bir listesini eklenmesini istediğiniz div kapsayıcı oluşturun.

errors.errorMessages = [ 
{'Message 1'}, 
{'Message 2'} 
] 

Bu kod Chrome ve ince işler:

<div id="errorList" style="padding:5px;"></div> 

sonraki fonksiyon

  let generateImportErrorReport = (errors) => { 
         let doc = createHtmlErrorReport(errors); 
         let errorReportWindow = window.open('', '_blank'); 
         errorReportWindow.document.write(doc); 
         let list = document.createElement('ul'); 
         //builds a list of errors 
         for (let i = 0; i < errors.errorMessages.length; i++) { 
          let item = document.createElement('li'); 
          let message = errorReportWindow.document.createTextNode(errors.errorMessages[i]);   
          item.appendChild(message); 
          list.appendChild(item);; 
         } 
} 

liste dize dizisi başka bir şey değildir hata listesi bu yöntemi çağırır ve inşa Ancak Firefox, IE'de yeni belge üretilir, ancak liste seçilen Element'e asla eklenmez. Oluşturulan öğeyi görebiliyorum ancak yeni oluşturulan belgeye eklenmeyecek. Dahili olarak IE dev araçları

Aynı anda benzer sorunlar ama html üreten ediyorum benim senaryoyu uyan çözümsüzlük ve belgenin diğer SO ilanları gördüğüm Error: No such interface supported

genel bir mesaj yakalar varolan bir belge ile çalışmak.

Düzenleme **: Bu kod standart js iken, açısal uygulamanın bir parçası olarak yazı tipinde yazılır. TS, ECMA3 olarak üretilir ve her iki ok işlevini veya standart notasyonu kullanarak aynı sonucu üretir.

Eksik olduğum şey hakkında herhangi bir öneri veya işaretçiyi takdir ediyorum.

+0

Yukarıda gösterilen kodu kullanır Tescilli olduğu için Edge'in mizanpaj motoruna göz atmanın hiç bir yolu yoktur. Bunun bir hata olduğunu söyleyebilirim çünkü MS, EdgeHTML'nin (düzen motoru) Webkit veya Blink'in yapabileceği herhangi bir sayfayı ince yapacağı (Safari ve Chrome) olduğunu açıkladı. – Li357

cevap

3

IE 11'de çalışmasını sağlamak için Mirko Cianfarani's suggestion öğesini takip edebilirsiniz: bu elemanların ekleneceği belge nesnesine dinamik öğeler oluşturun. Sizin durumunuzda, bu yeni rapor penceresinin, errorReportWindow.document belgesidir. Rapor dokümanı da sonunda kapatılmalıdır.

var generateImportErrorReport = function(errors) { 
    let doc = createHtmlErrorReport(errors); 
    let errorReportWindow = window.open('', '_blank'); 
    let errorDoc = errorReportWindow.document; // Get the error report document object 
    errorDoc.write(doc); 
    let list = errorDoc.createElement('ul'); // Create with errorDoc 
    // Builds a list of errors 
    for (let i = 0; i < errors.errorMessages.length; i++) { 
    let item = errorDoc.createElement('li'); // Create with errorDoc 
    let message = errorDoc.createTextNode(errors.errorMessages[i]); // Create with errorDoc 
    item.appendChild(message); 
    list.appendChild(item);; 
    } 
    var errorList = errorDoc.getElementById('errorList'); 
    errorList.appendChild(list); 
    errorDoc.close(); // Close the document 
} 

Bu iki plunkers kodu test edebilirsiniz:

İlgili konular