EmberJS 观察器

2018-01-03 17:35 更新

观察器

观察器更新计算属性的文本。它在文本更新或更改时触发。

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。

以上内容是否对您有帮助：

写笔记

我要补充