我开始与Ember合作,虽然我不熟悉函数式编程,JS和Ember也是。我遵循了一些教程,我决定尝试在视图中显示控制器中的一个变量。如果我理解错误,请纠正我,但视图作为控制器的上下文获取,并在手柄模板语言中呈现。上面的代码运行没有任何问题,只是名称没有显示,jut来自loginState模板的纯文本。
//app.js
App = Ember.Application.create();
App.ApplicationView = Ember.View.extend({
templateName: 'application'
});
App.ApplicationController = Ember.Controller.extend();
App.LoginStateView = Ember.View.extend({
templateName: 'loginState'
});
App.LoginStateController = Ember.Controller.extend({
name: 'Juriy'
});
App.Router = Ember.Router.extend({
root: Ember.Route.extend({
index: Ember.Route.extend({
route: '/',
connectOutlets: function(router){
router.get('applicationController').connectOutlet('loginState');
}
})
})
});
和
//index.html
<body>
<script type="text/x-handlebars" data-templamte-name="application">
My login page.
{{outlet}}
</script>
<script type="text/x-handlebars" data-templamte-name="loginState">
The name in the login state is {{name}}
</script>
</body>
答案 0 :(得分:2)
data-templamte-name
替换为data-template-name
,事情应该有效。
要调试此问题,我在每个模板的顶部附近添加了以下内容:
<pre>The context for application is: {{this}}</pre>
<pre>The context for loginState is: {{this}}</pre>
通过这个添加,我得到了以下输出:
The context for loginState is: <App.ApplicationController:ember194>
The name in the login state is
因此,应用程序模板完全呈现,并且loginState正在应用程序控制器的上下文中呈现。就像模板没有正确命名一样....
答案 1 :(得分:1)
您的模板定义中似乎存在一些拼写错误:
data-template-name =&gt;数据模板名称