本人原文地址发布在:点击这里

What problem did we meet?

As ember document suggestion, we may define a model as a structure which will be used for serialization or deserialization to request from RESTful-based server or others.

if we define a model as:

1 var Person = DS.Model.extend({
2   firstName: DS.attr('string'),
3   birthday:  DS.attr('date')
4 });

And we used like this:

1 this.store.find('person', 1); // => { id: 1, name: 'steve-buscemi' }

At the last, the “Store” will give us an object which has been deserialised by “Adapter” in Ember.js,  it just like Object-relationship mapping(ORM), we could use an object instead of json string, it’s very convenient.

It must have a premise that we have known what json string is or a constant structure. But if not,how do we solve this problem in Ember.js?

How did we solve this problem?

The problem is a common issue about “how to create an object/model dynamically”,   it is difficult maybe, if you have some experience with C# or Java language, because they are both static type of language which is difficult to create or define a structure at runtime. But in javascript you can easily define a object whatever you want, it’s  dynamic type of language also in Ember.js, we just need to do little work to implement this feature.

I will give an example as below:

Step 1:

 1 // app/controllers/
 2
 3 import DS from ‘ember-data’;
 4
 5 import Ember from ‘ember’;
 6
 7
 8 modelName: “info”,
 9
10
11 init: function() {
12
13   var info = this.getStructureInfo();
14
15   this.container.register('model:' + this.get(‘modelName’),       this.generateModel(info));
16
17 },
18
19
20 generateModel: function(content) {
21
22 var attrs =  {};
23
24 for(var key in content) {
25
26 attrs[key] = DS.attr(‘string’);
27
28 }
29
30 },
31
32
33 getStructureInfo: function() {
34
35 return [‘car', ‘price', ‘discount’];
36
37 }

In Step 1, we get structure information from “getStructureInfo” function, and then register a “info” model created by “generateModel” function.

Step 2:

1 // app/controllers/
2 loadData: function() {
3     return this.store.find(this.get(‘modelName’);
4 }

In step 2, we just use “loadData” function to load data from store automatically, the only one parameter is modelName. Is it easy?

In Ember.js the container.register function could inject object on runtime, so we could inject model  or other object into “Store”, then we used the “injected” object directly.

Reference

[ORM](https://en.wikipedia.org/wiki/Object-relational_mapping)

[static vs dynamic language](http://stackoverflow.com/questions/1517582/what-is-the-difference-between-statically-typed-and-dynamically-typed-languages)

转载于:https://www.cnblogs.com/cuiyansong/p/4746043.html

Ember.js之动态创建模型相关推荐

  1. js给动态创建出来的元素添加事件

    场景:因为js都是dom操作,所以如果动态创建一个元素的话,本身是不带自身事件的,因为在创建这个元素前,dom已经创建完成了,所以在动态创建出来的元素身上不包含事件 所以我们需要给这些动态创建出来的元 ...

  2. Ember.js 入门指南——定义模型

    2019独角兽企业重金招聘Python工程师标准>>> model也是一个类,它定义了向用户展示的属性和数据行为.model的定义非常简单,只需要继承DS.Model类即可,或者你也 ...

  3. js 页面动态创建一个坐标(图标)

    问题来源 在一个地图中,使用鼠标点击,添加一个mark(图标),来标识摄像头所在的位置 解决思路 添加一个div 元素在body最后,然后使用绝对定位(absolute),并让div的定位坐标与鼠标保 ...

  4. CocosCreator+TS动态创建模型(扇形区域)

    我这边是要在角色脚下创建一个扇形区域.效果图如下: 我用的版本是2.3.4,注意3.0以上版本接口不一样. 3.0以上版本可以参考社区一位大佬写的,我这边是用了他的顶点数据和UV. 出处:分享一个绘制 ...

  5. Angular platform-server.js 里动态创建 JavaScript 标签页的场景

    State transfer 的序列化和反序列化: script 的实际内容: 更多Jerry的原创文章,尽在:"汪子熙":

  6. js 动态创建table标签下的tr标签

    使用JavaScript根据后台获取的数据进行创建table标签下的tr标签 前端页面中的标签部分代码 <table class="layui-table lay-even" ...

  7. Ember.js入门教程、博文汇总

    第一章 对象模型 Ember.js 入门指南--类的定义.初始化.继承 Ember.js 入门指南--类的扩展(reopen) Ember.js 入门指南--计算属性(compute properti ...

  8. javascript动态创建表格:新增、删除行和列

    利用js来动态创建表格有两种格式,appendChild()和insertRow.insertCell().两种方式其实差不多,但第一种有可能在IE上有问题,所以推荐大家使用第二种了,直接说吧. 1. ...

  9. javascript 动态创建表格:新增、删除行和单元格

    2019独角兽企业重金招聘Python工程师标准>>> 利用js来动态创建表格有两种格式,appendChild()和insertRow.insertCell().两种方式其实差不多 ...

最新文章

  1. linux mysql 不稳定_linux,mysql:今天写出一个十分弱智的bug!
  2. SQL Server text field里面有换行符的时候copy到excel数据会散乱
  3. [unix shell笔记] - 和find命令结合使用xargs命令
  4. 【小白学PyTorch】7.最新版本torchvision.transforms常用API翻译与讲解
  5. 日常动手之:用python画行情图
  6. Dapr牵手.NET学习笔记:Actor小试
  7. CSDN编程挑战——《-3+1》
  8. php 获取所有子目录名,php读取目录及子目录下所有文件名的方法,_PHP教程
  9. java高级流程控制多线程作业设计_Java高级-解析Java中的多线程机制
  10. 【2017-12-06】c#基础-分支语句and循环语句
  11. 初识delphi-spring-framework
  12. 一份阿里员工排查程序问题的命令列表
  13. Div总在右下角的CSS实现方法
  14. 详解AI加速器:为什么说现在是AI加速器的黄金时代?
  15. 什么是锁?有几种锁?怎么用锁?
  16. 青春是一场眼眸里的微笑
  17. NopCommerce源码架构详解--TypeFinder程序集类型自动查找及操作相关源码分析
  18. linux更换进程执行码,第八节 进程的切换和系统的一般执行过程—— 20135203齐岳...
  19. NiFi 常用处理器(Processor)介绍
  20. MAX17043锂电池电量测量芯片C51驱动

热门文章

  1. P1955 [NOI2015] 程序自动分析
  2. java mvc mvvm_从MVC到MVVM(为什么要用vue)
  3. 局域网不能远程控制_如何通过Windows自带的局域网远程控制连接两台设备
  4. php导入csv 进度条,php 导入导出怎么做成有进度条??
  5. Noip模拟题解题报告
  6. java中调用 dll 动态库的简洁方法 JNative
  7. 字符串format函数使用
  8. python linux 下开发环境搭建
  9. Mybatis3.3.x技术内幕(十一):执行一个Sql命令的完整流程
  10. 线性代数与MATLAB2