Question

我开始与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>

Answer 1

TLDR：这是因为拼写错误。对于两个模板，将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正在应用程序控制器的上下文中呈现。就像模板没有正确命名一样....

Answer 2

您的模板定义中似乎存在一些拼写错误：

data-template-name =＆gt;数据模板名称

简单的灰烬控制器没有输出

2 个答案: