<table class="table table-striped table-sm small" > <thead class="bg-dark text-light"> <tr> <th scope="col">Id</th> <th scope="col">Name</th> <th scope="col">Nationality</th> <th scope="col" class="text-right"></th> </tr> </thead> <tbody data-bind="foreach: records"> <tr> <td class="align-middle" data-bind="text:DriverId"></td> <td class="align-middle" data-bind="text:Name"></td> <td class="align-middle"> <span id = "nation" data-bind="text:Nationality" class="float-left"> </span> <img id="flagicon" src="" alt="" class="flag float-right float-center" /> <script> var alpha_2_code = "pt"; /* for(let i=0; i < countrycodesobj.length ; i++){ if(countrycodes[i].Nationality === (data-bind = "text:Nationality")) alpha_2_code = countrycodes[i].alpha_2_code; }*/ var myPath = "https://countryflagsapi.com/png/" + alpha_2_code; document.getElementById("flagicon").src= myPath; </script> </td> </tr> </tbody>Quiero la información > data-bind="text:Nationality" < almacenada en una variable en la etiqueta del script. Obtengo la información de una API y está siendo manejada por knockoutjs. Mi conocimiento de knockoutjs es escaso y no sé si puedo acceder a la información data-bind="text:Nationality" en las etiquetas del script. Cualquier solución, ya sea en jquery, knockouts o javascript, sería perfecta. Gracias por adelantado.
puede hacer uso de una función simple que define antes de aplicar enlaces con knockout y después de definir su countrycodesobj, algo como:
function getFlagByNationality(n) { var alpha_2_code = "pt"; for(let i=0; i < countrycodesobj.length ; i++){ if(countrycodes[i].Nationality == n ){ alpha_2_code = countrycodes[i].alpha_2_code; } } return "https://countryflagsapi.com/png/"+alpha_2_code; }luego puede usar esto en el atributo de enlace de datos:
<img src="" data-bind="attr:{src: getFlagByNationality(Nationality)}" />