EmberJS 观察器
观察器
观察器更新计算属性的文本。它在文本更新或更改时触发。
fullName: function() {
var Name = this.get('Name');
return Name;
}.property('Name'),
NameChanged: function() {
this.set('Name','Jhon')
}.observes('fullName').on('init')
var person = App.Person.create({
Name: 'Yudistra'
});
在上面的代码中,
计算的属性函数 fullName 具有称为 Name 的变量。这最初将值保存为 Yudistra 。
NameChanged computed属性函数将 Name 变量设置为具有 observer 属性的新名称 Jhon 。此属性在更改名称值期间触发,并将值分配给 fulName 计算的属性函数。
例子
<!DOCTYPE html>
<html>
<head>
<title>Emberjs Observer</title>
<!-- CDN's-->
<script src="/attachements/w3c/handlebars.min.js"></script>
<script src="/attachements/w3c/jquery-2.1.3.min.js"></script>
<script src="/attachements/w3c/ember.min.js"></script>
<script src="/attachements/w3c/ember-template-compiler.js"></script>
<script src="/attachements/w3c/ember.debug.js"></script>
<script src="/attachements/w3c/ember-data.js"></script>
</head>
<body>
<script type="text/javascript">
App = Ember.Application.create();
App.Person = Ember.Object.extend({
//these will be supplied by `create`
Name: null,
fullName: function() {
//get the Name value
var Name = this.get('Name');
//return the Name value
return Name;
}.property('Name'),
NameChanged: function() {
// deal with the change
document.write("Name is Updated: ");
this.set('Name','Jhon')
//Observers never fire until after the initialization of an object is complete.
}.observes('fullName').on('init')
});
var person = App.Person.create({
//initial value of Name varialble
Name: 'Yudistra'
});
document.write(person.get('fullName'));
</script>
</body>
</html>
输出
让我们执行以下步骤,看看上面的代码如何工作:
将以上代码保存在 obsrvers.html 文件中。
在浏览器中打开此HTML文件。
下表列出了观察者的属性:
| 序号 | 实例和描述 |
|---|---|
| 1 | 观察器和异步 Ember.js中的观察器当前是同步的。 |
| 2 | 声明观察器 声明一个没有原型扩展和类定义之外的obsever。 |