2012-04-01 17 views
23

Por lo tanto, las plantillas de jQuery nunca pasarán de beta y se supone que jsRender y jsViews llenan el vacío. Revisé los ejemplos publicados por Boris Moore en this page pero no entiendo la diferencia entre jsRender y jsViews. Además, Boris ha usado uno en el ejemplo del otro para aumentar la confusión. Entonces, la pregunta es ¿cómo están dos de ellos relacionados (o diferentes)?Diferencia entre jsRender y jsViews

Respuesta

49

JsRender es el motor de plantillas. JsViews es el motor de enlace de datos.

JsRender lo ayuda a renderizar HTML utilizando una plantilla (HTML/CSS estático con tokens incrustados que se reemplazan con datos). Admite lógica simple, valores de representación y funciones personalizadas.

JsViews, que se basa en JsRender, agrega observabilidad a objetos/propiedades. Esto le permite vincular sus objetos json a objetivos HTML y obtener enlace de datos bidireccional.

Hay más para ellos, por supuesto, pero esa es la respuesta de 60 segundos. ¿Eso ayuda?

+0

Esto ciertamente ayuda, ¿puede dar algún enlace a una respuesta más completa? –

+4

Aquí hay un artículo que recientemente escribí en JsRender ... acaba de salir hoy en MSDN Magazine: http://msdn.microsoft.com/en-us/magazine/hh882454.aspx –

+1

esto debería ser una respuesta de aceptación en mi opinión – Blowsie

2

jsRender son solo plantillas, donde jsViews son plantillas, pero también vinculan datos. Entonces, si solo desea generar datos desde un objeto, lista o clase, entonces usaría el jsRender. Por lo tanto, rinde una plantilla. jsViews, sería para el enlace de datos en tiempo real, entre muchas otras características maravillosas. Por lo tanto, si representa una plantilla que lo usa y tiene un campo que estaba enlazado a datos, cuando lo modificó en el lado del cliente, en realidad está modificando el objeto al que lo obtuvo.

Por ejemplo, este es un uso real de este pequeño fragmento de mi trabajo.

//this is the script that handles the template 
<script id="questionResourceTemplate" type="text/x-jquery-tmpl"> 
    <li class="default-{{:IsDefault}}"> 
     <label data-link="visible{:!IsPageSpecific}" class="surv mleft5"><strong>{{:Type}}</strong></label> 
     <label data-link="visible{:IsPageSpecific}" class="surv mleft5"><input type="text" data-link="Type" /></label> 
     <a data-link="visible{:IsDefault}" href="#" action="deletequestionresource">Delete</a> 
     <br /> 
     {^{for QuestionResourceTexts tmpl="#textTemplate" ~parentQuestionResource=#data ~textboxClass="textbox" /}} 
    </li> 
</script> 

Y aquí es donde se utiliza en el código HTML

<ul class="question-resource-list"> 
    {^{for QuestionResources tmpl="#questionResourceTemplate" ~parentQuestion=#data /}} 
</ul> 

Así que en cada ocurrencia de este objeto, se hace que la plantilla. También tenemos funciones de ayuda aquí. Puede usarlos para cosas tales como devolver un valor booleano para una prueba y luego actuar sobre los datos como un encriptador durante el tiempo de vinculación. Esperemos que esto ayude a agregar a la respuesta ya perfecta respondida antes de esta respuesta.

1

A partir de los documentos:

JsRender se utiliza para la representación de las plantillas a las cuerdas, listo para inserción en el DOM.

También es utilizado por la plataforma JsViews, que añade que se unen a las plantillas JsRender de datos, y proporciona una plataforma MVVM de pleno derecho de crear fácilmente aplicaciones de una sola página basadas en datos interactivos y sitios web.