Ember
Dale_H
做一只愉快地前端狗~~~
展开
-
Ember 翻译——教程一:创建你的 APP
创建你的 APP欢迎来到 Ember 教程!这份教程旨在为大家在创建专业化应用的过程中来介绍基础的 Ember 概念。如果你在教程中遇到任何问题,请自由访问 https://github.com/ember-learn/super-rentals 来获取完整 app 的开发例子。翻译 2016-12-10 22:28:09 · 694 阅读 · 0 评论 -
Ember 翻译——教程八:创建一个 Handlebars helper
创建一个 Handlebars helper到目前为止,我们的 app 是直接将从我们的 Ember Data 模型中将数据获取出来进而呈现给用户的。当我们 app 不断壮大,我们将希望在将这些在呈现给用户之前进行处理。由于这个原因,Ember 提供了 Handlebars 模板 helper 来在我们的模板中修饰数据。让我们使用一个 Handlebars helper 来让我们的用户快速知道一套房翻译 2016-12-16 19:06:22 · 457 阅读 · 0 评论 -
Ember 翻译——教程二:设置测试
路由和模板Ember 使用路由来定义我们应用中逻辑性的、可访问的页面。在“超级租赁”中,我们想要访问展示租赁信息列表的首页。从这里,我们将能导航到一个关于页和一个联系页。让我们从关于页开始。请记住,当加载 /about 这个 URL 的时候,路由将把 URL 映射到同名的路由处理程序中——about.js。这个路由处理程序将将加载一个模板。翻译 2016-12-13 22:55:02 · 480 阅读 · 0 评论 -
Ember 翻译——教程九:创建一个复杂的组件
当用户搜索租赁信息时,他们或许也想要缩小他们的搜索范围到某一特定城市。让我们创建一个组件来让他们依照城市过滤租赁信息。一开始,让我们生成新的组件。我们将其命名为 list-filter,因为我们想要我们的组件对租赁信息基于用户输入进行过滤。ember g component list-filter和之前一样,这会创建一个 Handlebars 模板(app/templates/components/翻译 2016-12-22 01:22:45 · 534 阅读 · 0 评论 -
Ember 翻译——教程十:服务和功能
服务和功能对于“超级租赁”,我们想要一个能够展示租赁信息所在的网站地图。为了实现这个功能,我们将利用如下几个 Ember 概念: 1. 一个组件,用来在每个租赁列表展示一个地图。 2. 一个服务,用来缓存已经渲染的地图使得它能够在应用的不同地方能够使用。 3. 一个功能性函数,用来使用 Google 的地图 API 来创建一个地图。首先,我们会显示一个地图,然后转回使用 Google 地图 A翻译 2017-01-21 15:54:18 · 487 阅读 · 0 评论 -
Ember 翻译——教程十一:添加嵌套路由
添加嵌套路由添加嵌套路由在此时,我们已经生成了四个顶级路由:一个 about 路由,用来在应用中提供信息。一个 contact 路由,提供如何联系公司的信息。一个 rentals 路由,我们可以让用户浏览租赁信息。一个 index 路由,我们将其设置为重定向到 rentals 路由。 我们的 rentals 路由将提供多重服务。在我们的验收测试中,我们已经展示了我们想要我们的用户能够浏览翻译 2017-01-21 16:42:04 · 536 阅读 · 0 评论 -
Ember 翻译——教程十二:部署
部署要部署 Ember 应用程序,只需从 ember build 将输出上传到一个 web 服务器即可。这可以通过标准的 Unix 文件传输工具实现,比如 rsync 或者 scp。同时也有服务,可以让你更加轻松的部署。部署通过 scp 部署部署到 surgesh通过 scp 部署你可以通过从 ember build 中复制输出到任意一个 web 服务器来部署你的应用:ember build翻译 2017-01-21 17:02:46 · 561 阅读 · 0 评论 -
Ember 翻译——对象模型:一、Ember 中的对象
Ember 中的对象你会发现,标准的 JavaScript 类模式以新的 ES2015 的类都不会在 Ember 中被广泛使用;而你却会经常看见原生对象,有时它们也会被成为“散列”。JavaScript 对象不支持对属性值变化的监控。于是,如果一个对象要参与 Ember 的绑定系统,你将会看见 Ember.Object 而非一个原生对象。Ember.Object 也提供了一个类系统,它可以支持诸如混翻译 2017-02-01 12:13:08 · 504 阅读 · 0 评论 -
Ember 翻译——对象模型:二、类和实例
类和实例当你学习 Ember 的时候,你会看见像 Ember.Component.extend() 和 DS.Model.extend() 这样的代码。在这里,你将学习这个 extend() 方法以及 Ember 对象模型的其它的一些主要特性。定义类要定义一个新的 Ember 类,请调用 Ember.Object 上的 extend() 方法:const Person = Ember.Object.翻译 2017-02-01 23:10:42 · 588 阅读 · 0 评论 -
Ember 翻译——教程七:创建一个简单的组件
当用户浏览我们的租赁信息列表的时候,他们可能会想要有一些交互性的操作来帮助他们做出决定。让我们为每一条租赁信息添加切换图片大小的能力。为了完成它,我们将使用一个组件。让我们生成一个 rental-listing 组件,它将管理我们每一条租赁信息的行为。每个组件都需要一个破折号来避免和一个潜在的 HTML 元素发生冲突,所以 rental-listing 是可取的而 rental 不可取。ember翻译 2016-12-15 22:24:43 · 466 阅读 · 0 评论 -
Ember 翻译——教程六:使用 Ember Data
现在,我们的 app 还是使用的在 rentals 路由处理程序中硬编码的数据来设置模型。当我们的应用发展壮大的时候,我们将想要能够创建新、更新、删除租赁信息,以及将这些变动保存到后端服务器。Ember 集成了一个名叫 Ember Data 的数据管理库来帮助处理这些问题。让我们创建我们的第一个叫做 rental 的 Ember Data 模型:ember g model rental这将完成一个模翻译 2016-12-15 21:19:37 · 491 阅读 · 0 评论 -
Ember 翻译——教程四:模型钩子
模型钩子现在,让我们在 index 模板添加一个可租借信息列表。我们知道,租借信息不会是静态的,因为用户最后需要能够添加、更新、删除它们。因为这个原因,我们需要一个租借信息模型来保存租借信息。简单起见,一开始我们将使用硬编码的 JavaScript 数组对象。稍后,我们将切换到使用 Ember Data,它是我们的 app 中一个强力的 数据管理库。这会是我们主页已完成时候的样子: 在 Ember翻译 2016-12-14 23:04:59 · 550 阅读 · 0 评论 -
Ember 翻译——引导页
指南和教程欢迎来到 Ember.js 指南!这份文档将指引你从一个完全的新手成为一个 Ember 专家。组织左侧的每一篇教程,都是以表格形式呈现的,它们分别被分配到一些能够充分展示它们所包含的主题的章节中。章节和其包含的主题二者都按照从基础到高级的顺序排列。指南的目的是包含如何构建 Ember app 的实用建议,同时重点关注那些最常被使用的 Ember 的特性。如果需要涵盖每个 Ember 特性的翻译 2016-12-05 14:35:00 · 661 阅读 · 0 评论 -
Ember 翻译——官网首页
引言最近博客差点都被荒废了,最近在学习 Ember.js ,官方并没有给出中文文档,而且,这方面的中文文章、博客也不是特别多,加上前两天刚好去参加了 重庆前端交流会 ,受 月影 大大的启发,想要自己尝试一下技术文章的翻译,这里就试着翻译 Ember.js 的官方文档 了。我可能会根据自己的语言习惯进行修改,但总体尽量保持忠于原文,因为技术、语言功底有限,难免有出错的地方,请大家不吝赐教。引言Emb翻译 2016-11-30 15:10:12 · 1743 阅读 · 0 评论 -
Ember 翻译——教程三:路由和模板
路由和模板Ember 使用路由来定义我们应用中逻辑性的、可访问的页面。在“超级租赁”中,我们想要访问展示租赁信息列表的首页。从这里,我们将能导航到一个关于页和一个联系页。让我们从关于页开始。请记住,当加载 /about 这个 URL 的时候,路由将把 URL 映射到同名的路由处理程序中——about.js。这个路由处理程序将将加载一个模板。翻译 2016-12-13 22:56:26 · 690 阅读 · 0 评论 -
Ember 翻译——入门一:快速开始
快速开始 这指南将教你如何使用 Ember 从头开始建立一个简单的简单的 app。 我们会包含如下步骤: 快速开始 这指南将教你如何使用 Ember 从头开始建立一个简单的简单的 app 我们会包含如下步骤一安装 Ember 你可以使用 npm 的一条命令来安装 Ember npm 是 Nodejs 的包管理器在你的终端里输入如下命令 二创建一个新的应用 一旦你通过 npm 安装了翻译 2016-12-06 17:46:21 · 1513 阅读 · 0 评论 -
Ember 翻译——入门二:安装 Ember
上手 Ember 非常简单。我们可以使用命令行构建工具——Ember CLI 创建和管理 Ember 工程。这个工具提供: - 现代应用资源管理(包括级联、压缩和版本控制)。 - 帮助创建组件、路由等的生成器。 - 一个传统的工程布局,它可以使得 Ember 应用更接地气。 - 通过 Bable 实现对 ES2015/ES6 的支持。翻译 2016-12-07 21:39:50 · 1746 阅读 · 2 评论 -
Ember 翻译——入门三:核心概念
核心概念核心概念路由和路由处理程序模板模型组件在你开始写 Ember 代码之前,先了解一个 Ember 应用如何工作的是个不错的主意。路由和路由处理程序假想我们要编写一个让用户罗列他们准备出租房屋的 web app。在任何时候,我们都应该能够回答诸如他们在看的是什么房子、他们能否修改它之类的关于当前状态的问题。在 Ember 里,这些问题的答案取决于 URL。URL 可以通过如下方法被设置翻译 2016-12-08 13:10:00 · 998 阅读 · 0 评论 -
Ember 翻译——教程五:安装插件
Ember 拥有丰富多样的插件生态系统,这些插件能够轻松的应用到工程中。插件经常能为工程添加大量的功能,省时省力的同时,让你能够更好的集中精力到你的项目上。要浏览插件,请访问 Ember Observer 网站。它将发布到 NPM 的 ember 插件分门别类,同时根据一系列的标准对这些插件进行了评分。对于“超级租赁”,我们将利用如下两个插件: ember-cli-tutorial-style 和翻译 2016-12-15 20:31:45 · 579 阅读 · 0 评论 -
Ember 翻译——路由:介绍
路由介绍想象我们正在写一个用以管理一个博客的 web app。在任何给定的时间,我们应该能够回答诸如“他们正在看那篇文章”、“他们在更改它吗”等问题。在 Ember.js,这些问题的答案取决于 URL。URL 可以通过数种方式设置:用户第一次加载 app。用户手动改变 URL,比如点击返回按钮或者修改地址栏。用户点击一个 app 里面的链接。应用中一些其它的时间导致 URL 变化。不管 U翻译 2017-02-01 23:32:44 · 458 阅读 · 0 评论