ember Uncaught TypeError:在商店中加载时未定义不是函数 [英] ember Uncaught TypeError: undefined is not a function when loading in store

查看：17
本文介绍了ember Uncaught TypeError:在商店中加载时未定义不是函数的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用 ember 显示从我的 golang 服务器收到的数据.数据采用 JSON 格式.所以我打开了一个 websocket 并尝试推送在商店中收到的消息，但我收到了这个错误:未捕获的类型错误:未定义不是函数

这是我的 app.js:

 App = Ember.Application.create({LOG_TRANSITIONS: 真})/***************************** 帖子模板 ******************************************///为模板post"定义一个路由App.Router.map(function() {this.route("post", { path: "/post" });});//发布模型App.Post = DS.Model.extend({名称:DS.attr('string'),数字:DS.attr('string')});DS.SocketAdapterMixin = Ember.Mixin.create({uri: 'ws://localhost:8081/',初始化:函数(){this.ws = new WebSocket(this.uri);//回调this.ws.onopen = 函数(){console.log('连接建立/全部');};this.ws.onclone = 函数(){console.log('连接关闭/' + 'all');};this.ws.onmessage = 函数(数据){this.get('store').load(App.Post, data)控制台日志(数据)；};this._super();},初始化:函数(){console.log('SocketAdapterMixin::initialize');this._super();}});DS.SocketAdapter = DS.RESTAdapter.extend(DS.SocketAdapterMixin, {初始化:函数(){this._super();console.log('SocketAdapter');}});App.ApplicationAdapter = DS.SocketAdapter.extend({});//使用商店中的适配器App.Store = DS.Store.extend({修订:13，适配器:DS.SocketAdapter.create({})});

和我的 index.html:

 <html lang="zh-cn"><头><title>Ember.js 示例应用程序</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>--><身体><h1>卓悦</h1><script type="text/x-handlebars">你好，{{firstName}} {{lastName}}<br/><导航>{{#link-to 'post'}}发布{{/link-to}}</nav><div>{{出口}}

<script type="text/x-handlebars" data-template-name="index"><h2>我的包装</h2><ul>{{#模型中的每个帖子}}<li>{{post.number}}</li>{{/每个}}</script></p><script type="text/x-handlebars" data-template-name="post"><h2>我的帖子</h2><ul><li>齐德<li>法拉</li><script type="text/javascript"><身体>

我认为问题出在 this.get('store') 中，当我尝试打印其值时，它会打印 undefined.

解决方案

从 Ember Data 1.0 beta 1+ 开始，您没有在 Ember Data 中定义存储.

App.Store = DS.Store.extend({修订:13，适配器:DS.SocketAdapter.create({})});

只要使用这个就足够了:

App.ApplicationAdapter = DS.SocketAdapter;

store 被传递给 find 函数，如果你想你可以使用它.此外，您将超出 onmessage 的范围，但这不是重点.

推荐

由于您的程序有两层，我建议您使用依赖注入创建适配器/传输层.这是一个草稿

运输

DS.SocketTransport = Ember.Object.extend({uri: 'ws://localhost:8081/',类型:'帖子'，ws:空，商店:空，初始化:函数(){var uri = this.get('uri'),type = this.get('type'),store = this.get('store'),ws = new WebSocket(uri);//回调ws.onopen = 函数(){console.log('连接建立/全部');};ws.onclone = 函数(){console.log('连接关闭/' + 'all');};ws.onmessage = 函数(数据){//如果这是随机发布数据，则侧载store.load('post', 数据)控制台日志(数据)；};this._super();}});

网络套接字适配器

App.MyWsAdapter = DS.RESTAdapter.extend({运输:空，查找:函数(存储，类型，ID){var 运输 = this.get('transport');//在这里做你的事返回新 Ember.RSVP.Promise(function(resolve, reject){//使用这里的传输发送消息/获取消息，包含//上面提到的类型和id的json然后使用//解析(json)；});},});

依赖注入

App.initializer({名称:运输"，之后:['商店']，初始化:函数(容器，应用程序){var store = container.lookup('store:main'),postTransport = application.PostTransport.create({store:store, type:'post'});注册(我的:postTranspot"，postTransport)；application.PostAdapter = App.MyWsAdapter.create({运输:postTransport});}});

I'm using ember to display data received from my golang server. The data are in JSON form. so I opened a websocket and tried to push the message received in the store but i got this error: Uncaught TypeError: undefined is not a function

this is my 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({})
});

and my 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>

I suggest that the problem is in this.get('store'), it prints undefined when i try to print its value.

解决方案

You don't define the store in Ember Data since Ember Data 1.0 beta 1+.

App.Store = DS.Store.extend({ revision: 13, adapter: DS.SocketAdapter.create({}) });

Just using this will suffice:

App.ApplicationAdapter = DS.SocketAdapter;

The store is passed in to the find functions, if you want you can use it then. Additionally you would be out of scope inside of onmessage, but that's beside the point.

Recommendation

Since your program is two fold I'd recommend creating your adapters/transport layer using dependency injection. Here's a rough draft

Transport

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();
    }
});

Web Socket Adapter

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);
    });

  },

});

Dependency Injection

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
        });
    }
});

这篇关于ember Uncaught TypeError:在商店中加载时未定义不是函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆