2013-05-13 6 views
5

Ho un modello di visualizzazione con un array osservabile. La sua popolata con alcuni JSON:modello a eliminazione diretta - vincolo del testo a una funzione, con dati di modello passati in

this.socialTiles = ko.observableArray([]); 

ko.computed(function() { 

    jQuery.getJSON(this.apiURL+"&callback=?", function (data) { 

    var theData = data.entries; 
    tilesModel.socialTiles(theData); 
    console.dir(theData); 
    }); 
}, tilesModel); 

per ogni elemento nel modello, costruisco un li utilizzando il modello:

<ul id="tiles-ul" data-bind="template: {name:'twitter_template', foreach:socialTiles}"> 



<script type="text/html" id="twitter_template"> 
    <li class="social-tile box-shadow"> 
    <div class="header"> 
     <div class="header-img"> 
     <img data-bind="attr: { src: actor.avatar}"> 
     </div> 
     <div class="name_and_time"> 
     <span class="full-name" data-bind="text: actor.title"></span> 
     <span class="twitter-name" data-bind="text: actor.id"></span> 
     <span class="how-long-ago" > 5 minutes ago </span> 
     </div> 
    </div> 
    <div class="message-content" data-bind="html: object.content"> 
    </div> 
    <div class="footer"> 
     <div class="social-icon-twitter"> 
     </div> 
    </div> 

    <span data-bind="text: $index"></span>  
    </li> 
</script> 

id come ai dati-associare il testo di un elemento ad essere il risultato di una funzione, con i dati correnti dal modello utilizzato come argomento. Esempio:

actor.id è una stringa contenente un Twitter URL di un utente (come "http://twitter.com/iamdiddy")

vorrei passare la stringa di una funzione e restituire una rappresentazione '#iamdiddy'.

<span class="twitter-name" data-bind="text: getTwitterTag(actor.id)"></span> 

nel modello di visualizzazione

function getTwitterTag("twURL"){ 
    return ... whatever; 
} 

come posso fare questo (chiamare una funzione con l'argomento, non estrarre il # ...)? Il knockout supporta questa funzionalità?

risposta

19

Prova a cambiare

<span class="twitter-name" data-bind="text: getTwitterTag(actor.id)"></span> 

a

<span class="twitter-name" data-bind="text: $root.getTwitterTag($data)"></span> 
+0

$ root.getTwitterTag (actor.id) non ha funzionato, ma che cosa ha fatto il lavoro è stato di $ root.getTwitterTag ($ data), accettando la risposta in ogni modo poiché mi porta a scoprire la soluzione giusta – nuway