我一直关注这个tutorial以便为我的Laravel应用程序开发一个聊天系统,但是有些事情似乎已经过时了,我真的很喜欢Handlebars和JS。在步骤“创建界面”中,我尝试将教程中提供的代码调整为Handlebars 3.0中所需的语法,但我得到的只是一个空白页面。看起来Handlebars视图根本没有渲染,我可能会陷入一些非常基本的问题。这是我的代码。
<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="UTF-8" />
<link
rel="stylesheet"
type="text/css"
href="{{ asset("css/bootstrap.css") }}"
/>
<link
rel="stylesheet"
type="text/css"
href="{{ asset("css/bootstrap.theme.css") }}"
/>
<title>Laravel 4 Chat</title>
</head>
<body>
<script type="text/x-handlebars-template">
@{{outlet}}
</script>
<script
type="text/x-handlebars-template"
data-template-name="chat"
id='chat'
>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1>Laravel 4 Chat</h1>
<table class="table table-striped">
@{{#each}}
<tr>
<td>
@{{user}}
</td>
<td>
@{{text}}
</td>
</tr>
@{{/each}}
</table>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="input-group">
<input
type="text"
class="form-control"
/>
<span class="input-group-btn">
<button class="btn btn-default">
Send
</button>
</span>
</div>
</div>
</div>
</div>
</script>
<script
type="text/javascript"
src="{{ asset("js/shared.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/jquery-1.11.2.min.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/handlebars-v3.0.0.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/handlebars.runtime-v3.0.0.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/ember.debug.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/ember-data.js") }}"
></script>
<script
type="text/javascript"
src="{{ asset("js/bootstrap.js") }}"
></script>
<script type="text/javascript">
$(document).ready( function() {
var source = $("#chat").html();
var template = Handlebars.compile(source);
});
</script>
</body>
</html>
// 1
var App = Ember.Application.create();
// 2
App.Router.map(function() {
this.resource("chat", {
"path" : "/chat/"
});
});
// 3
App.Message = DS.Model.extend({
"user" : DS.attr("string"),
"text" : DS.attr("string")
});
// 4
App.ApplicationAdapter = DS.FixtureAdapter.extend();
// 5
App.Message.FIXTURES = [
{
"id" : 1,
"user" : "Chris",
"text" : "Hello World."
},
{
"id" : 2,
"user" : "Wayne",
"text" : "Don't dig it, man."
},
{
"id" : 3,
"user" : "Chris",
"text" : "Meh."
}
];
提前致谢!
答案 0 :(得分:0)
我认为目前ember不支持把手(hdbs)3.0。
请查看此post for a handlebars update info。不确定这是否是最新的,但似乎只支持hdbs 1.x.
由于Ember已更改为HTMLBars,请参阅此post以获取更改的信息。他们可能不会添加对hdbs 3.0的支持。
还有一个jsbin,您可以在其中查看如何使用最新版本的emberJS。