Javascript ember.js和服务器

Javascript ember.js和服务器,javascript,jquery,ajax,model-view-controller,ember.js,Javascript,Jquery,Ajax,Model View Controller,Ember.js,我正在看Ember.js,并且一直在阅读文档,试图了解如何使用它。我明白了(很好),除了一件事。按照我在MVC模式中的想法,模型是应用程序中数据的存储库。我可以在Ember.js中看到这是如何处理客户端数据的。我不明白的是如何将数据绑定回服务器,这样,如果客户机上的数据发生了更改,服务器上的更改也会更新。反之亦然。我一直在通过我的web应用程序对服务器进行Ajax/JSON调用来实现这一点,我只是不知道如何使用Ember.js来实现这一点。深入了解一下我发现: Ember数据是一个用于从持久层加

我正在看Ember.js,并且一直在阅读文档,试图了解如何使用它。我明白了(很好),除了一件事。按照我在MVC模式中的想法,模型是应用程序中数据的存储库。我可以在Ember.js中看到这是如何处理客户端数据的。我不明白的是如何将数据绑定回服务器,这样,如果客户机上的数据发生了更改,服务器上的更改也会更新。反之亦然。我一直在通过我的web应用程序对服务器进行Ajax/JSON调用来实现这一点,我只是不知道如何使用Ember.js来实现这一点。

深入了解一下我发现:

Ember数据是一个用于从持久层加载模型的库 (例如JSON API),更新这些模型,然后保存更改。 它提供了服务器端ORMs中的许多功能,如 ActiveRecord,但专为独特的环境而设计 在浏览器中使用JavaScript

我还建议你读书。您想要的是拥有一组模型,这些模型将知道如何与服务器端同步,可能的示例代码如下:

// our model
App.Person = Ember.Object.extend();

App.people = Ember.ArrayController.create({
  content: [],
  save: function () {
    // assuming you are using jQuery, but could be other AJAX/DOM framework
    $.post({
      url: "/people",
      data: JSON.stringify( this.toArray() ),
      success: function ( data ) {
        // your data should already be rendered with latest changes
        // however, you might want to change status from something to "saved" etc.
      }
    });
  }
});
然后在需要的时候调用App.people.save()

另外,请务必阅读本文,这篇文章深入探讨了与Ember的服务器-客户机通信,并提到了


注意:使用Emberjs数据库时要小心,因为它还没有做好生产准备。

在Ember.js中,如果您使用的是底层服务器端数据库,则
Ember
对象中包含的“模型”将包含底层服务器端数据库的进一步抽象。然后,应用程序的控制器部分应该有一些方法,允许您检索和发送在需要时调用的数据,以便更新模型(使用Ajax)。这很好,因为您有一个模型,可以在客户端快速响应用户向应用程序提供的任何输入(击键、鼠标移动等),并有选择地选择何时对服务器端数据库进行相对昂贵的查询。通过这种方式,应用程序的某些性能不再受到到外部服务器的数据请求延迟的影响,在某些情况下,您可以创建响应能力接近本机应用程序的应用程序。

我喜欢这样成对地描述Ember.js

  • 视图和模板是相关的(显然),调整视图类以控制模板(如类名)
  • 路由器和路由的工作方式有点像MVC中的控制器。他们负责将请求路由到正确的端点
  • 控制器和模型是以模型为中心的,其中一个(模型)描述您将在应用程序中处理的数据,而控制器的行为类似于一种代理(或装饰器,如果这更适合您的话)。模板将连接到控制器,例如
基本上,这意味着您可以使用模型加载控制器(单个或阵列),现在可以轻松地在控制器中对在该模型上工作的流程(即,不涉及模型核心/数据的内容)建模。对于一个示例博客应用程序,您可以在模型中描述帖子,并为控制器添加类似的内容

App.PostController = Ember.ObjectController.extend({
  content: null,

  // initial value
  isExpanded: false,

  expand: function() {
    this.set('isExpanded', true)
  },

  contract: function() {
    this.set('isExpanded', false)
  }
});
现在,您可以通过控制器以前端思维的方式与模型的表示进行交互。是否展开文章不会更改模型,只有更改数据才会更改模型

关于从服务器重新加载数据,我有两个答案

  • 我发现理解这些连接(以及简单的轮询,尽管很简单)非常有帮助
  • 如果您使用的是Rails,那么在即将推出的Rails4Live中您会很幸运,请参阅以了解更多有趣的部分

  • 我意识到这是一个有点老的问题,但它在ember.js的最高评分页面上,所以我想我应该添加一点


    我最近一直在使用它来处理RESTful数据绑定。它的铃铛和哨子比较少,但出于我的需要,它相当不错。基本上,它只是扩展了模型功能,以便与通过标准REST接口推送JSON对象的服务器很好地集成。

    DOM是文档对象模型,通常指HTML(或XML)元素及其API的树表示。在Ember.js中,模型肯定不会存储在DOM中,在DOM中存储数据也不是一个好主意——DOM是JavaScript浏览器API中最慢的部分。您也许可以在DOM中存储绑定(就像knockout.js一样),但不能存储模型本身。这就是为什么目前正在进行从jQuery的所有转换,即不在DOM中存储数据和数据本身的状态。@Gryzly-有任何文章/讨论提到DOM速度较慢以及jQuery存在问题吗?也许对于您的使用,jQuery和DOM都很好!当我第一次阅读BackboneJS的描述时:“在处理涉及大量JavaScript的web应用程序时,首先要学会的一件事是停止将数据绑定到DOM。创建JavaScript应用程序非常容易,最终会导致jQuery选择器和回调的混乱堆积,所有这些应用程序都疯狂地试图在HTML UI和JavaScript逻辑之间保持数据同步,以及服务器上的数据库。对于富客户端应用程序,更结构化的方法通常很有用。“它完全符合我的想法。虽然你肯定可以编写基准测试(这是我第一次回答你的问题时所做的)比较数据设置和从DOM获取与内存获取,这没有太大意义,这完全是关于团队的舒适度和产品的可维护性。因此,如果DOM方法适合您的需要,而您不觉得需要寻找更好的替代方法,那么这一点没有错。然而,当应用程序变大时,您开始意识到这一点从类或数据属性中检索应用程序的状态以根据该状态更新一些不相关的节点并不是最有效的方法