自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

香格里拉烤鸡腿的博客

翻译文章将移步至微信公众号: 译社

  • 博客(58)
  • 收藏
  • 关注

翻译 #9 自定义序列化器

英文原版:https://guides.emberjs.com/v2.14.0/models/customizing-serializers/在Ember Data中,序列化器用来给发送和接收的数据做格式化。默认的,Ember Data会以JSON API的形式来序列化数据。如果你的后端使用了不同的数据格式,Ember Data则允许你自定义序列化器或者使用符合要求的其他序列化器。Ember Dat

2017-08-14 23:15:00 315 1

翻译 #5 关联关系

英文原版: https://guides.emberjs.com/v2.14.0/models/relationships/Ember Data内建了若干关系类型帮你定义当前的模型与其他模型之间的联系。一对一要声明两个模型之间是一对一关系,使用 DS.belongsTo:app/models/user.jsimport DS from 'ember-data';export default DS.M

2017-08-13 14:42:05 342

翻译 #1 应用和实例

英文原版:https://guides.emberjs.com/v2.14.0/applications/applications-and-instances/每一个Ember应用都相当于是从Ember.Application继承的一个类。这个类用来声明和配置组成你应用的若干对象。当你的应用启动的时候,它会创建一个Ember.ApplicationInstance 来管理它的状态。这个实例作为你的应

2017-08-13 14:09:15 309

翻译 #8 自定义适配器

英文原版:https://guides.emberjs.com/v2.14.0/models/customizing-adapters/在Ember Data中,适配器决定了如何持久化发往后端存储的数据,例如URL格式、REST API标头等。(数据本身的格式是由序列化器决定的。) Ember Data默认的适配器对REST API的结构有一些内建的假定。如果你的后端没有遵循这些假定,Ember D

2017-08-06 23:32:35 344

翻译 #7 处理元数据

英文原版:https://guides.emberjs.com/v2.14.0/models/handling-metadata/伴随着store收到远程返回的记录,你有可能会需要处理元数据–metadata。 Metadata 是与某种模型或类型有关的数据,并非与记录有关。分页是一个展示如何使用metadata的常见例子。假设博客包含的帖子太多,一次展示不完。那么你可能会想这么分阶段的获得不同的帖

2017-08-02 22:20:30 240

翻译 #6 记录入库

英文原版:https://guides.emberjs.com/v2.14.0/models/pushing-records-into-the-store/认知store的其中一种方法是将它作为已读取的记录的缓存。如果route或controller需要获得记录,那么store可以立即返回已被缓存的记录;否则store会向适配器索取记录,这通常意味着将会向服务器发起一个请求。相对于等待从远端获取记录

2017-07-30 22:34:52 229

翻译 #4 创建、更新和删除

创建记录你可以调用store的createRecord()方法创建一条记录:store.createRecord('post', { title: 'Rails is Omakase', body: 'Lorem ipsum'});在controller和route中可以通过this.get(‘store’)来获得store对象。更新记录更新一条记录,实际上是更新记录中属性的值:this.

2017-07-28 13:55:33 238

翻译 #3 查询记录

英文原版:https://guides.emberjs.com/v2.14.0/models/finding-records/Ember Data的store提供了一个接口用来检索某个类型的记录。检索单条记录使用store.findRecord()来通过type和id来检索一条记录。这将会返回一个带有记录数据的promise对象。let blogPost = this.get('store').fi

2017-07-27 16:08:21 767

翻译 #2 定义模型

英文原版:https://guides.emberjs.com/v2.14.0/models/defining-models/模型,是一个定义了交互数据中的属性和行为的一个类,并且通过模型来向用户展示内容。任何用户希望看到的内容都应该用model来代表。当你需要创建一个新的模型时,你需要在models文件夹下面创建一个新的文件,并且这个新的模型要从DS.Model类继承。用Ember CLI命令来创

2017-07-27 14:35:49 243

翻译 #1 介绍

英文原版:https://guides.emberjs.com/v2.14.0/models/模型(Model)是一个代表应用提供给用户的基础数据的对象。不同应用基于要面对的问题提供不同的模型。比如,一个用来分享照片的应用或许需要一个Photo模型用来代表照片,一个PhotoAlbum模型用来代表一组照片。于此形成鲜明对比的是,一个在线的购物应用会需要若干个不同的模型,比如购物车、票据、购买项等。模

2017-07-27 00:01:33 264

翻译 Controller

英文原版:https://guides.emberjs.com/v2.14.0/controllers/Controller与组件类似,它会在进入路由的时候被执行。controller只接收一个参数 —- 路由中的model( )钩子返回的model。要定义一个controller,使用命令:ember generate controller my-controller-namecontroller

2017-07-20 00:05:44 394

翻译 #8 通过Actions触发变化

英文原版:https://guides.emberjs.com/v2.14.0/components/triggering-changes-with-actions/

2017-07-17 22:55:31 358

翻译 #7 事件处理

英文原版:https://guides.emberjs.com/v2.14.0/components/handling-events/你可以在你的组件上通过事件处理函数响应用户事件,比如:双击、悬停等。实现这样的方式比较简单。例子,比如我们现在有个模板:{{#double-clickable}} This is a double clickable area!{{/double-clickab

2017-07-16 22:30:31 271

翻译 #6 块参数

英文原版:https://guides.emberjs.com/v2.14.0/components/block-params/组件可以被传入参数,同时组件也可以通过块参数来返回输出。通过{{yield}}从组件返回值app/templates/index.hbs{{blog-post post=model}}app/templates/components/blog-post.hbs{{yield

2017-07-16 21:10:46 188

翻译 #5 自定义组件根元素

英文原版:https://guides.emberjs.com/v2.14.0/components/customizing-a-components-element/默认的,每一个组件都被一个<div>元素包裹。如果你通过浏览器的带的开发工具来观察一下DOM结构的话,你会发现你的每个组件渲染后的DOM最外层元素都如下面这样:<div id="ember180" class="ember-view"

2017-07-10 22:03:15 865

翻译 #4 为组件提供内容

英文原版:https://guides.emberjs.com/v2.14.0/components/wrapping-content-in-a-component/可能在有些时候,你或许需要你的组件包裹一些在其他模版中定义的内容。比如,假设现在你创建了一个blog-post组件,用来在应用中展示一篇博客:app/templates/components/blog-post.hbs<h1>{{tit

2017-07-09 22:54:59 226

翻译 #3 给组件传递属性

英文原版:https://guides.emberjs.com/v2.14.0/components/passing-properties-to-a-component/组件是与它所在的环境完全隔离的,所以任何组件需要的东西都必须要传递给它比如,假设你现在有个blog-post组件用来展示博客:app/templates/components/blog-post.hbs<article class=

2017-07-08 23:32:07 256

翻译 #2 组件生命周期

英文原版:https://guides.emberjs.com/v2.13.0/components/the-component-lifecycle/组件最吸引人的就是它允许你介入DOM。这允许你可以直接对DOM进行操纵,监听和响应浏览器事件,并且你可以在Ember应用中加入第三方JS库。当组件被初次渲染,重新渲染直至最后被移除,Ember提供了一系列的生命周期钩子可以使你在组件特定的生命周期执行特

2017-07-05 21:36:16 2850

翻译 #9 input助手

英文原版:https://guides.emberjs.com/v2.13.0/templates/input-helpers/{{input}}和{{textarea}}助手是创建常用表单控件的最简单的方式。通过使用这些助手,你可以创建与用原生<input>或<textarea>生成的相同的表单,但是需要清楚的是Ember具有的双向绑定的特性。文本字段{{input value="http://w

2017-07-01 23:03:47 225

翻译 #1 定义组件

英文原版:https://guides.emberjs.com/v2.13.0/components/defining-a-component/定义组件,使用以下命令:ember generate component my-component-name组件在命名时,必须至少带一个”-“号。所以blog-post是一个合法的命名,audio-player-controls也是,但是post是不合法的。

2017-07-01 18:18:37 235

翻译 #8 Actions

英文原版:https://guides.emberjs.com/v2.13.0/templates/actions/你的应用肯定需要一些用户的交互功能。比如,想象一下我们现在有一个模板用来展示了一个帖子的标题,并且当点击标题的时候,帖子的内容会被展示出来。如果你在HTML DOM元素上使用{{action}}助手,当用户点击这个元素的时候,那么一个被你命名的action事件就会被发送到当前模板对应的

2017-07-01 18:00:15 271

翻译 #7 Links

英文原版:https://guides.emberjs.com/v2.13.0/templates/links/{{link-to}}组件通过{{link-to}}组件创建一个链接到某个路由的超链接。app/router.jsRouter.map(function() { this.route('photos', function(){ this.route('edit', { path

2017-07-01 14:04:50 218

翻译 #6 绑定元素属性

英文原版:https://guides.emberjs.com/v2.13.0/templates/binding-element-attributes/除了绑定普通文本之外,你同样可能会想要绑定模板中HTML元素的属性。例如,我们假设你的controller中有个属性,它的值是一个链接到图片的URL。<div id="logo"> <img src={{logoUrl}} alt="Logo"

2017-07-01 13:31:23 201

翻译 #5 遍历Hash对象

英文原版:https://guides.emberjs.com/v2.13.0/templates/displaying-the-keys-in-an-object/如果你需要在模板中显示javascript对象的key或者value,那么你可以使用{{#each-in}}助手:/app/components/store-categories.jsimport Ember from 'ember';

2017-07-01 13:18:20 199

翻译 #4 展示列表

英文原版:https://guides.emberjs.com/v2.13.0/templates/displaying-a-list-of-items/

2017-06-27 20:59:51 172

翻译 #3 条件判断

英文原版:https://guides.emberjs.com/v2.13.0/templates/conditionals/像比如if 或者 unless这样的语句,在Ember中也被作为助手实现了。助手有三种被调用的方式,下面就来了解每种的调用方式。行内调用第一种—- 行内调用。这看上去就与显示属性的写法差不多,不过需要接收参数:<div> {{if isFast "zoooom" "put

2017-06-25 13:08:20 220

翻译 #2 内建的助手

英文原版:https://guides.emberjs.com/v2.13.0/templates/built-in-helpers/内建的助手在上一节我们了解到了如果来自定义一个助手。助手通常是一些在模版中随时都可能用到的简单逻辑。Ember提供了一些助手来帮你减轻一些开发的工作量。这些助手会帮你通过更动态的方式来给其他的助手或者组件中传值。通过助手来动态得到属性{{get}}助手可以帮你轻松把变

2017-06-25 00:33:12 178

翻译 #9 异步路由

英文原版:https://guides.emberjs.com/v2.13.0/routing/asynchronous-routing/本节涵盖了一些router的高级功能,即异步逻辑处理能力。聊聊PromisesEmber的router在处理异步逻辑的时候大量使用了Promise。简而言之,promise是表示最终结果的对象。一个promise可以被完成(即 resolve)或被拒绝( 即 re

2017-06-21 22:01:47 2437

翻译 #1 Handlerbars 基础

英文原版:https://guides.emberjs.com/v2.13.0/templates/handlebars-basics/Ember使用 Handlebars templating library来支持用户接口。Handlerbars模版包括惊天的HTML和动态的Handlerbar表达式。Handlerbar表达式中动态的内容通过数据绑定技术来渲染。这就是说,当你更新某个Ember对

2017-06-20 10:33:02 574

翻译 #7 Loading/Error 子状态

英文原版:https://guides.emberjs.com/v2.13.0/routing/loading-and-error-substates/Ember Router允许你提供一个读取数据时的反馈–loading状态,同样也提供了error状态。loading 子状态在beforeModel,model和afterModel钩子函数的执行过程中,数据同时也是需要通过消耗一些时间来读取的。典

2017-06-18 21:41:16 731

翻译 #6 阻止和重启路由

英文原版:https://guides.emberjs.com/v2.13.0/routing/preventing-and-retrying-transitions/在路由转换期间,Ember Router会把一个transition对象传入route中每一个被调用的钩子函数。任何一个钩子都可以通过与此transiton对象交互,并使用transition.abort()方法来立即终止当前的tra

2017-06-18 20:41:13 279

翻译 #5 重定向

英文原版:https://guides.emberjs.com/v2.13.0/routing/redirection/有些时候你会想要把用户从他们要访问的页面重定向到另一个页面。比如,如果用户没有登录成功,你可能会想要阻止他们编辑个人的认证信息,资料或者查看购物车等。通常你会将用户重定向到登录页,并且仅在用户成功登录后,才允许用户访问那些页面。Ember允许你通过路由中的钩子函数或方法控制这个交互

2017-06-15 22:23:13 265

翻译 #4 渲染模板

英文原版:https://guides.emberjs.com/v2.13.0/routing/rendering-a-template/路由的另一个职责就是渲染对应的模板。默认的,路由处理程序会渲染与其同名的模板。看下面这个路由:app/router.jsRouter.map(function() { this.route('posts', function() { this.rout

2017-06-13 23:22:51 280

翻译 #3 给路由分配模型

通常,你可能会需要通过模板来展示从model中获得的数据。读取正确的模型数据是路由的职责之一。比如,下面这个路由:app/router.jsRouter.map(function() { this.route('favorite-posts');});为了从favorite-posts路由中读取数据,你需要通过model()钩子函数来达到目的:app/routes/favorite-posts

2017-06-13 22:50:14 287

翻译 #2 定义路由

英文原版:https://guides.emberjs.com/v2.13.0/routing/defining-your-routes/当你开始运行你的app时,router会将当前的URL与你定义路由相匹配。这些路由呢,则会负责显示模板,读取数据并且更新app状态。定义路由,命令:ember generate route route-name这个命令创建了个一个路由源文件:app/routes/

2017-06-12 22:59:28 279

翻译 #1 介绍

英文原版:https://guides.emberjs.com/v2.13.0/routing/假设,我们现在正在编写一个用来管理论坛的web app。任何时候,我们应该能对于问题“大家都在关注哪些帖子?他们正在编写帖子吗?”给出答案。在Ember.js中,这些问题的答案都取决于URL。URL可以通过以下几种方式来设置:用户第一次读取页面。用户手动的更改的URL,例如点击后退按钮、直接编辑地址栏

2017-06-12 21:51:00 195

翻译 #8 枚举

Ember中,一个枚举是指有一系列子对象的对象,并且你可以使用Ember.EnumerableAPI来操作它们。 大部分情况下,你遇到的枚举是在app中的javascript数组,并且它已经在Ember中被继承了原型。通过用来处理枚举的标准接口,Ember.js允许你在不更改app其他部分代码的前提下,彻底的改变你底层数据的存储方式。枚举API最大化的支持了ECMAScript标准。这使得ember

2017-06-11 21:14:48 200

翻译 #7 绑定

英文原版:https://guides.emberjs.com/v2.13.0/object-model/bindings/不同于其他框架的实现的绑定,Ember.js中的绑定可以用于任何对象。同时对于Ember使用者来说,计算属性是优先推荐的解决方案。最简单的添加双向绑定的方式是使用computed.alias():husband = Ember.Object.create({ pets: 0

2017-06-10 21:16:21 223

翻译 #6 观察者

英文原版:https://guides.emberjs.com/v2.13.0/object-model/observers/【注】观察者很容易被Ember新手滥用。由于观察者本身就比较耗性能,所以在面对大多数情况时,推荐使用计算属性。观察者支持观察任何属性,包括计算属性。观察者其实就是一个监听器,它能反映出其他属性的变化。当你需要在观察目标完成同步操作后做些事情,那么它尤其有用。

2017-06-08 22:39:23 161

翻译 #5 计算属性与数据集合

有时候你的计算属性它所依赖的是个数组。比如,你有个todos属性,它是个对象数组。这时候你想基于对象的isDone属性统计一下有个对象符合条件。@each为了扶持你,Ember提供了一个@each关键字:app/components/todo-list.jsexport default Ember.Component.extend({ todos: null, init() { thi

2017-06-07 23:22:54 343

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除