Ember.js EmberJS中的命名模板_Ember.js

Ember.js EmberJS中的命名模板

ember.js

Ember.js EmberJS中的命名模板,ember.js,Ember.js,我是EmberJS的新手，在Ember.js的热身中畅游我被困在1.4级命名模板中，他们要求我：将我们主页独有的内容移动到一个新模板中，并给它一个模板名称，该名称将显示在我们网站的主页上。对于此代码 <!DOCTYPE html> <html> <head> <base href='http://courseware.codeschool.com/ember/' /> <link href='bootstrap.css'

我是EmberJS的新手，在Ember.js的热身中畅游

我被困在1.4级命名模板中，他们要求我：将我们主页独有的内容移动到一个新模板中，并给它一个模板名称，该名称将显示在我们网站的主页上。 对于此代码

    <!DOCTYPE html>
<html>
<head>
  <base href='http://courseware.codeschool.com/ember/' />
  <link href='bootstrap.css' rel='stylesheet' />
  <link href='application.css' rel='stylesheet' />
  <script src='jquery.js'></script>
  <script src='handlebars.js'></script>
  <script src='ember.js'></script>
  <script src='ember-data.js'></script>
  <script src='app.js'></script>
</head>
<body>
  <script type='text/x-handlebars' data-template-name='application'>
    <div class='navbar navbar-default'>
      <div class='container'>
        <a href='#' class='navbar-brand'><img src='images/logo.png' alt='logo' height='34' width='224' /></a>
        <ul class='nav navbar-nav navbar-right'>
          <li href='#' class='active'>Home</li>
          <li href='#/about'>About</li>
        </ul>
      </div>
    </div>
    <div class='container'>
      <h1>Welcome to The Flint &amp; Flame!</h1>
    </div>
    <footer class='container'>
      <hr />
      <p class='pull-left'>&copy; 2013 The Flint &amp; Flame</p>
      <p class='pull-right'><a href='#/credits'>Credits</a></p>
    </footer>
  </script>
</body>
</html>



主页
关于

欢迎来到弗林特&；火焰！

©；2013年的弗林特&；火焰

我这样做了，但在尝试了这个之后仍然不起作用：

    <!DOCTYPE html>
<html>
<head>
  <base href='http://courseware.codeschool.com/ember/' />
  <link href='bootstrap.css' rel='stylesheet' />
  <link href='application.css' rel='stylesheet' />
  <script src='jquery.js'></script>
  <script src='handlebars.js'></script>
  <script src='ember.js'></script>
  <script src='ember-data.js'></script>
  <script src='app.js'></script>
</head>
<body>
  <script type='text/x-handlebars' data-template-name='application'>
    <div class='navbar navbar-default'>
      <div class='container'>
        <a href='#' class='navbar-brand'><img src='images/logo.png' alt='logo' height='34' width='224' /></a>
        <ul class='nav navbar-nav navbar-right'>
          <li href='#' class='active'>Home</li>
          <li href='#/about'>About</li>
        </ul>
      </div>
    </div>
    <div class='container'>
  <script type='text/x-handlebars' data-template-name='index'>
     <h1>Welcome to The Flint &amp; Flame!</h1>
    </script>
    </div>
    <footer class='container'>
      <hr />
      <p class='pull-left'>&copy; 2013 The Flint &amp; Flame</p>
      <p class='pull-right'><a href='#/credits'>Credits</a></p>
    </footer>
  </script>
</body>
</html>



主页
关于

欢迎来到弗林特&；火焰！

©；2013年的弗林特&；火焰

您忘记向应用程序模板中添加索引模板，而将索引模板嵌套在应用程序模板中，这是错误的

<!DOCTYPE html>
<html>
<head>
    <base href='http://courseware.codeschool.com/ember/'/>
    <link href='bootstrap.css' rel='stylesheet'/>
    <link href='application.css' rel='stylesheet'/>
    <script src='jquery.js'></script>
    <script src='handlebars.js'></script>
    <script src='ember.js'></script>
    <script src='ember-data.js'></script>
    <script src='app.js'></script>
</head>
<body>
<script type='text/x-handlebars' data-template-name='application'>
    <div class='navbar navbar-default'>
        <div class='container'>
            <a href='#' class='navbar-brand'><img src='images/logo.png' alt='logo' height='34' width='224'/></a>
            <ul class='nav navbar-nav navbar-right'>
                <li href='#' class='active'>Home</li>
                <li href='#/about'>About</li>
            </ul>
        </div>
    </div>
    {{outlet}}
</script>
<script type='text/x-handlebars' data-template-name='index'>
    <div class='container'>
        <h1>Welcome to The Flint &amp; Flame!</h1>
    </div>
    <footer class='container'>
        <hr/>
        <p class='pull-left'>&copy; 2013 The Flint &amp; Flame</p>

        <p class='pull-right'><a href='#/credits'>Credits</a></p>
    </footer>
</script>
</body>
</html>



主页
关于

{{outlet}}
欢迎来到弗林特&；火焰！

©；2013年的弗林特&；火焰