2

我试图做这三件简单的事情，但我已经无法在一个世界上弄清楚几乎一个月，一个词---沮丧！现在我怀疑 emberjs 是否真的值得...

我想要：

  1. 仅使用 .php 文件从数据库中获取数据，数据将采用 json 格式

    注意：我在我问的其他 SO 问题中这样做了，所以我不会重复。

  2. 现在，问题是，如何将这些数据保存在没有余烬数据的“商店”中？

  3. 有没有关于 php 如何与 emberjs 连接的可用教程？我试图阅读它的 REST 适配器，但似乎它需要某种类型的 JSON API。如果我使用纯 PHP 代码作为后端，是否需要开发 JSON API？

如果有什么不清楚的地方，请在评论中回复！非常感谢。

4

2 回答 2

3

陈，老实说，没有 ember-data 处理数据非常容易。我用过几次，其中一些与构建相当大的前端系统有关。主要原因是当时的 ember-data 并没有那么稳定，并没有激发太多的信心。另一个原因是，正如您将看到的那样，它非常简单。

您所要做的就是创建一个类（拥有一个单例 ember 控制器也很好），它将从服务器获取数据并将数据发布到服务器。数据格式应为 JSON，以使所有过程更轻松、更清晰。您可以通过使用简单的 ajax 调用来实现这一点，

function retrieveData(callback){
jQuery.ajax({
            url: *yoururl*,
            timeout: ajaxTimeOut,
            success: function(data){
/* here you store this data somewhere
it could be helpful to have a callback that you call so that this class/controller
is not coupled with specific logic*/
                if(callback!=null){
                    callback(data);
                }
            }
        });
}

当关联的路由被调用或从该路由的控制器调用时，可以调用检索数据的函数。传递给前一个类/控制器的回调函数会将检索到的数据设置为控制器的某些属性，甚至可以是它的模型。简单的例子， http ://emberjs.jsbin.com/AsOcAbU/1/edit

js

App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.IndexRoute = Ember.Route.extend({
  /*model: function() {
    return ['red', 'yellow', 'blue'];
  },*/
  setupController:function(controller,model){
      this.controllerFor('myJSON').findJSONData(function(data){
        controller.set('model',data);
      });
  }
});

App.IndexController = Ember.ArrayController.extend({

});

App.MyJSONController = Ember.Controller.extend({

  findJSONData:function(callback){
    var data = ['red', 'yellow', 'blue'];/*this will come from the server with an ajax call i.e. $.ajax({...})*/
    if(callback){
      callback(data);
    }
  }

});

HBs

   <script type="text/x-handlebars">
        <h2>Welcome to Ember.js</h2>

        {{outlet}}
      </script>

      <script type="text/x-handlebars" data-template-name="index">
      {{#if model}}
        <ul>
        {{#each item in controller}}
          <li>{{item}}</li>
        {{/each}}
        </ul>
        {{else}}
        loading ....
        {{/if}}
      </script>

在完整应用程序的上下文中，您可能需要迭代 json 数据并从中创建 ember 对象。多亏了 ember，这也很简单，

http://emberjs.jsbin.com/oWetaDuH/1/edit

/*let's say you retrieve color objects from php*/

 findJSONData:function(callback){
  setTimeout(function(){

   /*this will come from the server 
     with an ajax call i.e. $.ajax({...})*/
    var data = [{color:'red'}, {color:'yellow'}, {color:'blue'}];

    if(callback){
      callback(data);
    }

  },2000);//mimic ajax call
 }

/*and you need to use ember magic bindings, so you have your own objects to represent the domain model*/
App.MyColor = Ember.Object.extend({
  color:null
});

/*then the code for retrieving will become*/

setupController:function(controller,model){
  this.controllerFor('myJSON').findJSONData(function(data){
        var myColors=[];
        data.forEach(function(jsonColor){
          myColors.pushObject(App.MyColor.create(jsonColor));/*this is all you need to create the ember object !!*/
        });
        controller.set('model',myColors);
      });
  }

和hbs

<script type="text/x-handlebars" data-template-name="index">
  {{#if model}}
    <ul>
    {{#each item in controller}}
      <li>{{item.color}}</li>
    {{/each}}
    </ul>
    {{else}}
    loading ....
    {{/if}}
  </script>

更新

如果需要在模型解决之前暂停路由，promises则应按照指南中的说明使用

http://emberjs.com/guides/routing/asynchronous-routing/

在这种情况下，由于jQuery ajax函数返回一个 Promise，所以前面的例子看起来像，

http://emberjs.jsbin.com/mogicira/1/edit

js

App.IndexRoute = Ember.Route.extend({
  model:function(controller,model){
      return    this.controllerFor('myJSON').findJSONData(function(data){
        var myColors=[];
        data.forEach(function(jsonColor){
          myColors.pushObject(App.MyColor.create(jsonColor));
        });
     return myColors;
      });
  }
});

App.IndexController = Ember.ArrayController.extend({

});

App.MyJSONController = Ember.Controller.extend({

  findJSONData:function(callback){
    return $.ajax({url:""}).then(function(data){

          data = [{color:'red'}, {color:'green'}, {color:'blue'}];

    if(callback){
       return callback(data);
    }

    });
  }

});
于 2013-11-11T19:15:46.277 回答
2

如果您喜欢 ember 和 ember-data，它应该是为了减少其他重要问题之间的代码和代码维护

如果您对 php 感到满意，请将您的 php 代码移动到现代框架中，以免重新发明轮子，并获得与 ember 对您的前端所做的类似的好处

我正在开发一个使用 Codeigniter http://ellislab.com/codeigniter和 codeigniter rest 服务https://github.com/philsturgeon/codeigniter-restserver提供的 ember 应用程序， 但我不建议您使用这种组合

我认为你应该尝试 Laravel http://net.tutsplus.com/tutorials/php/laravel-4-a-start-at-a-restful-api/或直接去 Rails/Rails-API

于 2013-11-12T11:25:57.657 回答