EmberJS - 计算属性

计算属性将函数声明为属性,Ember.js 会在需要时自动调用计算属性,并将一个或多个属性组合在一个变量中。

下表列出了计算属性的属性 −

S.No. 属性 &描述
1 链接计算属性

链接计算属性用于与一个或多个预定义的计算属性进行聚合。

2 动态更新

在调用计算属性时动态更新计算属性。

3 设置计算属性

帮助使用 setter 和 getter 方法设置计算属性。

示例

以下示例将计算属性添加到 Ember.object 并展示如何显示数据 −

import Ember from 'ember';

export default function() {
   var Car = Ember.Object.extend ({
      
      //以下变量的值将由"create"方法提供
      CarName: null,
      CarModel: null,
      carDetails: Ember.computed('CarName', 'CarModel', function() {

         //将值返回给计算属性函数"carDetails"
         return ' Car Name: ' + this.get('CarName') + '<br>' + 
            ' Car Model: ' + this.get('CarModel');
      })
   });

   var mycar = Car.create ({
      //初始化 Car 变量的值
      CarName: "Alto",
      CarModel: "800",
   });
   
   //显示车辆信息
   document.write("<h2>Details of the car: <br></h2>");
   document.write(mycar.get('carDetails'));
}

现在打开 app.js 文件并在文件顶部添加以下行 −

import computedproperties from './computedproperties';

其中,computedproperties 是指定为"computedproperties.js"并在"app"文件夹下创建的文件的名称。现在,在导出之前,在底部调用继承的"computedproperties"。它执行在 computedproperties.js 文件中创建的 computedproperties 函数 −

computedproperties();

输出

运行 ember 服务器,您将收到以下输出 −

Ember.js 计算属性

emberjs_object_model.html