2.5 The Object Model -- Observers
Ember支持监视任何属性,包括计算的属性。你可以使用Ember.observer为一个对象设置一个监视者:
Person = Ember.Object.extend({
//these will be supplied by 'create'
firstName: null,
lastName: null, fullName: Ember.computed('firstName', 'lastName', function () {
var firstName = this.get('firstName');
var lastName = this.get('lastName'); return firstName + ' ' + lastName;
}); fullNameChanged: Ember.Observer('fullName', function () {
//deal with the change
});
}); var person = Person.create({
firstName: 'Yehuda',
lastName: 'Katz'
}); person.set('firstName', 'Brohuda'); // observer will fire
- 因为计算的属性fullName依赖于firstName,更新firstName也会启动fullName的监视者。
一、Observers and Asynchrony(监视者和异步)
1. Ember中的监视者目前是同步的。这意味着一旦监视到其中一个属性改变它们就会启动。它很容易解释属性还未同步的bugs。
Person.reopen({
lastNameChanged: Ember.observer('lastName', function () {
//监视者依赖lastName和fullName。因为监视者是同步的,
//当方法被调用时,fullName的值还没有被更新,所以会输出它之前的值
console.log(this.get('fullName'));
});
});
2. 当监视多个属性的时候,这种同步的行为也可以导致监视者被启动多次。
Person.reopen({
partOfNameChanged: Ember.observer('firstName, 'lastName', function () {
//因为firstNam和lastName都被设置了,这个监视者将会被启动两次。
});
}); person.set('firstName', 'John');
person.set('lastName', 'Smith');
3. 为了克服这些问题,你应该使用Ember.run.once。一旦所有绑定是同步的,这将确保任何处理你的需求仅会发生一次并发生在下一个循环:
Person.reopen({
partOfNameChanged: Ember.observer('firstName', 'lastName', function() {
Ember.run.once(this, 'processFullName');
}), processFullName: Ember.observer('fullName', function() {
// This will only fire once if you set two properties at the same time, and
// will also happen in the next run loop once all properties are synchronized
console.log(this.get('fullName'));
})
}); person.set('firstName', 'John');
person.set('lastName', 'Smith');
二、Observers and Object Initialization
1. 监视者不会启动直到对象初始化完成以后。
如果你需要监视者启动作为初始化程序的一部分,你不能依靠set的作用。相反,通过使用Ember.on()指定监视者应该在init之后运行。
Person = Ember.Object.extend({
init: function() {
this.set('salutation', 'Mr/Ms');
}, salutationDidChange: Ember.on('init', Ember.observer('salutation', function(){
//some side effect of salutation changing
}));
});
三、剩余的计算属性不触发监视者
1. 如果你从来没有get一个计算属性,尽管它依赖的keys变化了,它的监视者也不会启动。你可以理解为值从一个位置的值变为了另一个。
2. 这通常不会影响应用程序代码,因为当它们被获取的时候计算属性几乎总是在同一时间被监视。例如,你获得了计算属性的值,把它放到DOM中,然后监视它,这样一旦属性变化你就会更新DOM。
3. 如果你需要监视计算属性但是目前没有检索它,仅仅是在你的init方法中获取它。
四、Outside of Class Definitions(在类定义的外面)
你也可以使用addObserver在类定义的外面为一个对象添加监视着。
person.addObserver('fullName', function(){
//deal with the change
});
2.5 The Object Model -- Observers的更多相关文章
- Selenium的PO模式(Page Object Model)[python版]
Page Object Model 简称POM 普通的测试用例代码: .... #测试用例 def test_login_mail(self): driver = self.driver driv ...
- 在C#开发中如何使用Client Object Model客户端代码获得SharePoint 网站、列表的权限情况
自从人类学会了使用火,烤制的方式替代了人类的消化系统部分功能,从此人类的消化系统更加简单,加速了人脑的进化:自从SharePoint 2010开始有了Client Side Object Model ...
- Selenium的PO模式(Page Object Model)|(Selenium Webdriver For Python)
研究Selenium + python 自动化测试有近两个月了,不能说非常熟练,起码对selenium自动化的执行有了深入的认识. 从最初无结构的代码,到类的使用,方法封装,从原始函数 ...
- 解决在使用client object model的时候报“object does not belong to a list”错误
在查看别人代码的时候,发现了个有意思的问题,使用client object model将一个文件check in 我使用的是如下语句获取file Microsoft.SharePoint.Client ...
- Page Object Model (Selenium, Python)
时间 2015-06-15 00:11:56 Qxf2 blog 原文 http://qxf2.com/blog/page-object-model-selenium-python/ 主题 Sel ...
- SharePoint Client Object Model API 介绍以及工作原理解析
CSOM和ServerAPI 的对比 SharePoint从2010开始引入了Client Object Model的API(后文中用CSOM来代替),从名字来看,我们可以简单的看出,该API是面向客 ...
- BOM (Browser Object Model) 浏览器对象模型
l对象的角色,因此所有在全局作用域中声明的变量/函数都会变成window对象的属性和方法; // PS:尝试访问未声明的变量会抛出错误,但是通过查询window对象,可以知道某个可能未声明的对象是否存 ...
- 文本对象模型(Document Object Model)
本文内容: 1. 概述 2. DOM中的节点类型 3. DOM节点的选取 4. 存取元素属性 5.DOM元素的增删 6.小结 ★ 概述 文本对象模型(DOM)是一个能够让程序和脚本动态访问和更新文档内 ...
- 浏览器对象模型(BOM,Browser Object Model)
本文内容 1.概述 2.windows与document 3.对话框 4.定时调用 5.URL解析与访问历史 6.浏览器和屏幕信息 ★概述 &q ...
随机推荐
- RIDE指定log和report的输出目录
在命令行中,输入 pybot --help就可以看到他支持的所以命令和相关的介绍 我们可以看到outputdir这个命令,就是来知道report和log的输出目录的 如果你是在命令行中,那么直接后面跟 ...
- Zookeeper(二)-- 客户端操作命令
一.前提 开启zookeeper服务端,用客户端连接.输入help,查看可使用命令,如下图所示: 操作无非就是增删改查等. 二.增加 格式:create [-s] [-e] path data acl ...
- 嵌入式系统UBOOT
一个完整的嵌入式linux系统包含4部分内容:Bootloader.Parameters.Kernel.Root File System.3.4.5.6部分详细介绍了这4部分的内容,这是Linux底层 ...
- [译]Facebook广告基础--数字广告指南
广告商指南 原文链接:https://www.facebook.com/business/help/337584869654348/ Ads Help - Desktop > Learn Abo ...
- eclipse启动错误
1.错误日志 !SESSION 2013-12-09 12:24:33.826 -----------------------------------------------eclipse.build ...
- LeetCode——Populating Next Right Pointers in Each Node
Description: Given a binary tree struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; Tree ...
- 常用的jq插件
1.时间版翻转 FlipClock-master 2.整屏切换 fullpage 3.轮播图 swiper 4.滚动条样式 mCustomScrollbar 5.过滤和排序布局插件 Isotope. ...
- ansible的入门级使用
author: headsen chen date: 2018-08-02 11:46:35 1,ansible的安装 yum install epel-release yum -y i ...
- [USB] Windows USB/DVD Download Tool
此工具为微软官方U盘启动盘制作工具 Windows USB/DVD Download Tool 说明:https://www.microsoft.com/en-us/download/windows- ...
- HTML5+CSS3 表格设计(Table)
<style> body { width: 600px; margin: 40px auto; font-family: 'trebuchet MS', 'Lucida sans', Ar ...