EmberJS - 觀察器

觀察器監視屬性（如計算屬性）並更新計算屬性的文字。它在文字更新或更改時觸發。

語法

funName1: Ember.computed(function() {
   //code here
}),

funName1: Ember.observer(function() {
   //code here
});

var varname = ClassName.create({
   //code here
});

下表列出了觀察器的屬性 -

示例

以下示例演示瞭如何使用觀察器更新計算屬性的文字 -

import Ember from 'ember';

export default function() {
   var Person = Ember.Object.extend ({
      Name: null,
      
      //Defining the Details1 and Details2 computed property function
      Details1: Ember.computed('Name', function() {
         
         //get the Name value
         var Name = this.get('Name');
         //return the Name value
         return Name;
      }),

      Details2: Ember.observer('Details1', function() {
         this.set('Name','Steve Waugh');
      })
   });

   //initializing the Person details
   var person = Person.create ({
      //initial value of Name varialble
      Name: 'Mark Waugh'
   });

   //updating the value for 'firstName' using set() method
   document.write('<strong>The updated name : </strong>' +person.get('Details1'));
}

現在開啟 app.js 檔案，並在檔案頂部新增以下行 -

import observers from './observers';

其中，觀察器是指定為“observers.js”的檔名，並在“app”資料夾下建立。現在，在匯出之前，在底部呼叫繼承的“觀察器”。它執行在 observers.js 檔案中建立的 observers 函式 -

observers();

輸出

執行 ember 伺服器，你會收到以下輸出 -