tutorial template props ember component classnamebindings ember.js

ember.js - template - ember tutorial



Ember.js: Handlebars no muestra nada (1)

/app.js var Welcome = Ember.Application.create({}); Welcome.person = Ember.View.extend({ personName: ''Andrew'' });

Aquí está el contenido de index.html, parte de la vista:

/index.html <!doctype html> <!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]--> <!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]--> <!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]--> <!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]--> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title></title> <meta name="description" content=""> <meta name="author" content=""> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <script type="text/x-handlebars"> {{personName}} </script> <script src="js/libs/handlebars-1.0.0.beta.6.js"></script> <script src="js/libs/ember-1.0.pre.min.js"></script> <script src="js/app.js"></script> </body> </html>

Mi pregunta es por qué no muestra nada? ¿No debería representar el contenido de personName ?

ACTUALIZAR:

Estoy usando el Starter Kit de Ember. Ya tiene una vista definida. Acabo de agregar una propiedad más al objeto pero todavía no está visible para la vista.

App.MyView = Em.View.extend({ mouseDown: function() { window.alert("hello world!"); }, name: ''Andrew'' });

Y la parte de vista en .html es:

<script type="text/x-handlebars"> {{#view App.MyView}} <h1>Hello world {{name}}!</h1> {{/view}} </script>

Dado que el evento funciona, ¿no se supone que el nombre es accesible?


Desde 1.0, las vistas preservan su contexto.

VIEW CONTEXT CHANGES In apps built on earlier version of Ember (before 1.0), the {{#view}} helper created a new context for the view. This meant that you had to explicitly set the context on them. In 1.0, we''ve made this a bit simpler. The {{#view}} helper no longer changes the context, instead maintaining the parent context by default. Alternatively, we will use the controller property if provided. You may also choose to directly overridethe context property. The order is as follows: Specified controller Supplied context (usually by Handlebars) parentView''s context (for a child of a ContainerView) In the event that you do need to directly refer to a property on the view, you can use the view keyword, i.e. {{view.myProp}}. So, for your example, tou have to use {{view.name}} <script type="text/x-handlebars"> {{#view App.MyView}} <h1>Hello world {{view.name}}!</h1> {{/view}} </script>