YOSHINO日記

プログラミングに関すること

Ember.js入門3: bindingsでオブジェクトのプロパティ同士を結びつける

bindings: setもgetもできる

import EmberObject from '@ember/object';

export default function() {
  const Teacher = EmberObject.extend({
    homeroom: '',
    age: '',
    gradeTeaching: ''
  });

  const Student = EmberObject.extend({
    homeroom: Ember.computed.alias('teacher.homeroom'),
    age: '',
    grade: '',
    teacher: null
  });

  const tom = Teacher.create({
    age: '27',
    homeroom: '1075',
    gradeTeaching: 'sophmore'
  });

  const joey = Student.create({
    age: '16',
    grade: 'sophmore',
    teacher: tom
  });

  console.log(joey.get('age'));
  console.log(tom.get('homeroom'));
  tom.set('homeroom', '2434');
  console.log(joey.get('homeroom'));
}

Studentクラスのhomeroom: Ember.computed.alias('teacher.homeroom'),のところで、 Bindingしている。

getもsetもできる。

One Way bindings: setしかできない

import EmberObject from '@ember/object';
import Ember from 'ember';

export default function() {
  const User = EmberObject.extend({
    firstName: null,
    lastName: null,
    nickName: Ember.computed.readOnly('firstName')
  });

  const user = User.create({
    firstName: 'Erick',
    lastName: 'Hanchett'
  });

  console.log(user.get('nickName'));
  user.set('nickName', 'hoge');   // ここでError!!
}

readOnlyで指定したプロパティにsetしようとするとエラー。

oneWayは利用することができなかった(本来であれば、エラーはでないが、setしても値が変わらないといった挙動になるはずなんだけど)。