我正在使用ember来显示从golang服务器收到的数据。数据采用JSON格式。 所以我打开了一个websocket并试图推送商店收到的消息,但是我收到了这个错误: 未捕获的TypeError:undefined不是函数
这是我的app.js:
App = Ember.Application.create({
LOG_TRANSITIONS: true
})
/******************************* Post Template **************************************/
//Define a route for the template "post"
App.Router.map(function() {
this.route("post", { path: "/post" });
});
//Post Model
App.Post = DS.Model.extend({
name: DS.attr('string' ),
number: DS.attr('string')
});
DS.SocketAdapterMixin = Ember.Mixin.create({
uri: 'ws://localhost:8081/',
init: function(){
this.ws = new WebSocket(this.uri);
// callbacks
this.ws.onopen = function() {
console.log('Connection established /all');
};
this.ws.onclone = function() {
console.log('Connection closed /' + 'all');
};
this.ws.onmessage = function(data) {
this.get('store').load(App.Post, data)
console.log(data);
};
this._super();
},
initialize: function() {
console.log('SocketAdapterMixin::initialize');
this._super();
}
});
DS.SocketAdapter = DS.RESTAdapter.extend(DS.SocketAdapterMixin, {
init: function() {
this._super();
console.log('SocketAdapter');
}
});
App.ApplicationAdapter = DS.SocketAdapter.extend({});
// Use the adapter in the store
App.Store = DS.Store.extend({
revision: 13,
adapter: DS.SocketAdapter.create({})
});
和我的index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Ember.js Example Application</title>
<script src="js/libs/jquery-1.10.2.js"></script>
<script src="js/libs/handlebars-1.1.2.js"></script>
<script src="js/libs/ember-1.5.1.js"></script>
<script src="js/libs/Ember_Data.js"></script>
<script src="js/app.js"></script>
<script src="js/router.js"></script>
<!-- <script src="js/models/model.js"></script> -->
</head>
<body>
<h1>Bonjour </h1>
<script type="text/x-handlebars">
Hello, {{firstName}} {{lastName}}<br/>
<nav>
{{#link-to 'post'}}Post{{/link-to}}
</nav>
<div>
{{outlet}}
</div>
</script>
<script type="text/x-handlebars" data-template-name="index">
<h2>My Wrappers</h2>
<ul>
{{#each post in model}}
<li>{{post.number}}</li>
{{/each}}
</ul>
</script></p>
<script type="text/x-handlebars" data-template-name="post">
<h2>My Post</h2>
<ul>
<li> Zied</li>
<li> Farah</li>
</ul>
</script>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
我建议问题出现在this.get('store')中,当我尝试打印它的值时,它会打印undefined。
答案 0 :(得分:0)
自Ember Data 1.0 beta 1+以来,您不会在Ember Data中定义商店。
App.Store = DS.Store.extend({
修订:13,
适配器:DS.SocketAdapter.create({})
});
使用它就足够了:
App.ApplicationAdapter = DS.SocketAdapter;
商店会传入find
功能,如果您愿意,可以使用它。此外,您将超出onmessage
范围内的范围,但这不是重点。
由于您的程序是双重的,我建议使用依赖注入创建适配器/传输层。这是一份草稿
DS.SocketTransport = Ember.Object.extend({
uri: 'ws://localhost:8081/',
type: 'post',
ws: null,
store: null,
init: function(){
var uri = this.get('uri'),
type = this.get('type'),
store = this.get('store'),
ws = new WebSocket(uri);
// callbacks
ws.onopen = function() {
console.log('Connection established /all');
};
ws.onclone = function() {
console.log('Connection closed /' + 'all');
};
ws.onmessage = function(data) {
// if this is random post data, side load
store.load('post', data)
console.log(data);
};
this._super();
}
});
App.MyWsAdapter = DS.RESTAdapter.extend({
transport: null,
find: function(store, type, id) {
var transport = this.get('transport');
// Do your thing here
return new Ember.RSVP.Promise(function(resolve, reject){
// use the transport here to send a message/get a message, containing
// the json for the type and id mentioned above then use
//resolve(json);
});
},
});
App.initializer({
name: "transport",
after:['store'],
initialize: function (container, application) {
var store = container.lookup('store:main'),
postTransport = application.PostTransport.create({store:store, type:'post'});
register("my:postTranspot", postTransport);
application.PostAdapter = App.MyWsAdapter.create({
transport: postTransport
});
}
});