O JQuery-Mobile não joga bem com o JQuery-TMPL?

Question

Existe alguma razão pela qual o mesmo modelo e JavaScript

<script id="taskTemplate" type="text/x-jquery-tmpl">
  <li>${name}</li>
</script>

$.getJSON(url, function(data) {       
  $("#taskTemplate").tmpl(data).appendTo("#tasks");
});

funcionaria conforme documentado com a seguinte marcação JQTouch:

<ul class="rounded" id="tasks"></ul>

Mas resultar na renderização do modelo para fora (depois) da lista não ordenada com a seguinte marcação JQuery-Mobile?

<div data-role="content"> 
  <ul data-role="listview" id="tasks"></ul>
</div><!-- /content -->

Sei que o JQuery-Mobile está no lançamento do Alpha, mas está funcionando bem até agora e eu prefiro não mudar para o JQTouch nesta fase. Alguém viu esse comportamento e encontrou uma solução alternativa?

Answer 1

Você precisa ligar para o método de atualização do ListView assim que seu modelo for feito.

$ ("yourul"). ListView ("atualização"); Caso o método .Page () nunca tenha sido chamado, você pode querer fazer algo assim.

    try { 
        $(yourUl).listview("refresh");
    } catch(e){
        // Well, nothing to do there
    } 

Answer 2

Isso foi corrigido no Alpha 2. Veja aqui: http://jquerymobile.com/demos/1.0a2/#docs/lists/docs-lists.html (role para baixo até 'Listas de atualização')

Answer 3

Deve parecer

$("#taskTemplate").tmpl(data).appendTo("#tasks").page();

Você precisa do .Page () no final.