(shadowPropertyName: string, forceAsync?: boolean): PropertyDecorator

Observed property decorator: use given property as the shadow (writable) property for decorated property.

The decorated property itself (which must have a property getter) will not be observed, and given property is observed instead. However, the ‘current value’ passed to observer methods will still be the value that is obtained through the getter of the decorated property.

  • shadowPropertyName — the name of the shadow property that should be observed instead.

  • forceAsync — if true, forces observers to observe this property asynchronously only, to prevent the occurance of side effects when setting the value of the shadow property; any attempt to observe the decorated property using a synchronous observer method (without ...Async) results in an error.


class MyComponent extends Component {
  get foo() { return this._foo || 0 }

  // running this method will trigger the observer's
  // onFooChange method even if it changes _foo:
  doSomething() {

  private _foo?: number;
MyComponent.observe(class {
  constructor (public readonly c: MyComponent) { }
  onFooChange(v: number) {
    console.log("foo is now " + v);

let c = new MyComponent();  // 0
// => foo is now 1  // 1