Tengo un código de barras y quiero mostrarlo varias veces para imprimirlo.
Cuando agrego la etiqueta svg de javascript , después de generar el código de barras, no aparecen.
$scope.generatePrintBarcodePage = function (sampleCode, number) { $scope.barCodePrint = []; var i; for (i = 1; i <= number; i++) { JsBarcode("#barcode" + i, sampleCode, { height: 40, displayValue: true }); } } $scope.showBarcode = function (sampleCode, number) { for (i = 1; i <= number; i++) { const node = document.createElement("svg"); node.setAttribute("id", "barcode" + i); document.getElementById("printPageBarcode").appendChild(node); JsBarcode("#barcode" + i, sampleCode.SampleCode, { } }Entonces no se muestra ningún código de barras.
Pero si creo previamente la etiqueta svg en el archivo html, se muestran, pero si la creo, no tengo control sobre cuántos códigos de barras quiero imprimir.
<div id="printPageBarcode" style=" height: 500px;"> <svg id="barcode1"></svg> <br /> <svg id="barcode2"></svg> <br /> <svg id="barcode3"></svg> <br /> <svg id="barcode4"></svg> <br /> <svg id="barcode5"></svg> <br /> </div>¿Cómo puedo agregar el mismo código de barras varias veces?
Los elementos SVG no se pueden crear dinámicamente usando createElement de la misma manera que los elementos HTML. Si desea generar un svg, use la función createElementNS .
function showBarcode (sampleCode, number) { for (let i = 1; i <= number; i++) { let node = document.createElementNS("http://www.w3.org/2000/svg", "svg"); node.setAttribute("id", "barcode" + i); document.getElementById("printPageBarcode").appendChild(node); JsBarcode("#barcode" + i, sampleCode, { height: 40, displayValue: true }); } } showBarcode("test", 5); <script src="https://cdn.jsdelivr.net/npm/jsbarcode@3.11.0/dist/JsBarcode.all.min.js"></script> <div id="printPageBarcode"> </div>