程序员经验分享-hwhale

ember Uncaught TypeError：在存储中加载时，未定义不是一个函数

2024-01-10

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

这是我的 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 。


自 Ember Data 1.0 beta 1+ 以来，您不再在 Ember Data 中定义存储。

App.Store = DS.Store.extend({ revision: 13, adapter: 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
        });
    }
});
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

emberjs

WebSocket

Store

ember Uncaught TypeError：在存储中加载时，未定义不是一个函数 的相关文章

  • 将 css 类添加到 Ember.js 中的

    如何将CSS类添加到特定路线上的body标签 我尝试使用body在车把模板中添加标签但不起作用 Update 经过一番谷歌搜索后 我找到了这个解决方案 不确定这是最好的方法 但它确实有效 App SomeRoute Em Route ext

  • Symfony 2 GeniusesOfSymfony/WebSocketBundle

    我正在 symfony 2 应用程序中工作 我需要使用 websocket 我找到了一个名为 GeniusesOfSymfony WebSocketBundle 的包 并将其集成到系统中 该捆绑包基于 JDare ClankBundle 但

  • EmberJS：对象作为查询参数来刷新模型

    我遵循了查询参数指南 http guides emberjs com v1 11 0 routing query params http guides emberjs com v1 11 0 routing query params 而且效

  • Edge浏览器Websocket连接将在空闲时间后自动关闭

    我在新的Window Edge浏览器上做了关于Websocket的测试 看来Edge浏览器上的websocket连接会在空闲时间后自动关闭 没有数据传输b w 2端点 在 Chrome 或 Firefox 上不会出现此问题 我只是好奇 在E

  • 有没有办法在 ember 商店中的任何 ember 模型更改上设置观察者？

    首先 我使用的是ember 2 我正在请求后端 它返回一些数据 然后 我将这些数据推送到 ember 存储中的模型 问题是我想在更新此模型时执行一些操作 那么 有没有办法在店里观察模型呢 先感谢您 findAll返回实时数组 因此我们可以为

  • 获取对给定模型对象创建的 EmberJS 视图的引用？

    假设我有一个清单DefinedWord对象 每个对象都渲染在 each 块作为列表DefinedWordViewdiv 位于页面底部 当用户单击一个单词时 我会查找关联的DefinedWord 现在我想要一个参考DefinedWordVie

  • 加载 Ember.View 的内容后初始化 jQuery 插件

    DEBUG Ember VERSION 1 0 0 rc 6 ember js DEBUG Handlebars VERSION 1 0 0 rc 4 ember js DEBUG jQuery VERSION 1 9 1 控制器是一个Em

  • Tornado websocket handler ， self.close() 正在关闭连接而不触发 on_close() 方法

    我是 python stackoverflow tornado 的新手 所以请耐心等待 纠正我 我正在使用龙卷风开发实时应用程序 当我在 Websocket 处理程序类中调用 self close 时 on close 方法不会启动 这次我

  • 哪些浏览器支持 HTML5 WebSocket API？

    这个问题的答案是社区努力 help privileges edit community wiki 编辑现有答案以改进这篇文章 目前不接受新的答案或互动 我将开发一个在浏览器中运行的即时消息应用程序 哪些浏览器支持WebSocket API

  • 使用 ember.js 无限滚动（延迟加载）

    我有一个视图 其中可能有大量项目供用户滚动 我想实现无限滚动以实现内容的渐进加载 看起来有些人已经做了分页 https stackoverflow com questions 8778259 ember js rendering large

  • 使用 Node.js 的前端 javascript 框架 [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi

  • IP 地址 v4/v6 等效性测试

    是否可以在使用 IPv4 和 IPv6 的双栈环境中测试 IP 地址的等效性 如果是这样 怎么办 我的应用程序使用网络套接字 https github com zaphoyd websocketpp在 Boost ASIO 之上 举个例子

  • 可以模拟多个并发连接来测试 Nodejs 应用程序

    我有一个简单的node js socket io websockets 应用程序运行 localhost 我想看看它可以处理多少并发连接 是否可以在本地主机本身上模拟多个并发用户 这是我使用 socket io client 的半生尝试 f

  • 如何修复套接字 io 中的 400 错误错误请求？

    我有一个前端应用程序 VUE JS 我有一个后端 Nest JS Vue JS 应用程序使用 vue socket io extended 库通过 websockets 从后端获取数据 当 Vue JS 应用程序启动时 我在浏览器中看到错误

  • Ember.js - 渲染到插座中的默认模板？

    所以我有一个如下所示的页面 Nav Bar Content 我希望导航栏在所有页面上保持不变 所以我使用的方法是将我的页面设置如下 Nav Bar outlet 这太棒了 我现在可以将不同的页面渲染到不同路线的出口中 但是 如果我希望将默认

  • 如何使用 Ember.run.debounce 实现正确的关闭

    我尝试使用 Ember run debounce 仅在有许多子视图触发保存时触发父视图或控制器上的保存操作 问题似乎是闭包 匿名函数 但我找不到在这种情况下在 Ember 中实现去抖的最佳方法的任何示例 这是一个概述该问题的 jsbin 任

  • 围绕活动的 {{linkTo}} 创建一个

    • 最干净的获取方式是什么 li class active 对于以下 Ember 应用程序中的活动页面 索引 html app js App Ember Application create App Router map function th

  • 重写 buildURL 方法以包含父模型的 id

    关于 ember data 和子类化 DS RESTAdapter 来覆盖buildURL 我有两个端点 可以说他们是 example com users user id example com users user id images 将

  • 如何在重新渲染 Ember 视图的一部分时随时运行代码？

    我的目标是拥有一个类似 Facebook 的按钮 可以有条件地出现在 Ember 视图中 我的模板是 if condition Click Like div class fb like fb edge widget with comment

  • ObjectController 上的绑定 - Ember.js

    当您尝试将绑定添加到ObjectController它不起作用 App FailController Em ObjectController extend content null myBinding App router myContro

随机推荐

热门标签