hello-component.html

<p>hello {{name}}</p>

hello-component.ts

@Component({
  selector: 'hello-component',
  templateUrl: 'hello-component.html'
})
export class HelloComponent {
  name: string;
  constructor(){
    this.name = 'World';
    setTimeout(() => this.name = 'World!!!', 1000);
  }
}

z.hello-component.ngfactory.js

export class View_HelloComponent0 extends AppView {
    constructor(viewUtils, parentView, parentIndex, parentElement) {
        super(View_HelloComponent0, renderType_HelloComponent, ViewType.COMPONENT, viewUtils, parentView, parentIndex, parentElement, ChangeDetectorStatus.CheckAlways);
        this._expr_2 = UNINITIALIZED;
    }
    createInternal(rootSelector) {
        const parentRenderNode = this.renderer.createViewRoot(this.parentElement);
        this._el_0 = createRenderElement(this.renderer, parentRenderNode, 'p', EMPTY_INLINE_ARRAY, null);
        this._text_1 = this.renderer.createText(this._el_0, '', null);
        this.init(null, (this.renderer.directRenderer ? null : [
            this._el_0,
            this._text_1
        ]), null);
        return null;
    }
    detectChangesInternal(throwOnChange) {
        const currVal_2 = inlineInterpolate(1, 'hello ', this.context.name, '');
        if (checkBinding(throwOnChange, this._expr_2, currVal_2)) {
            this.renderer.setText(this._text_1, currVal_2);
            this._expr_2 = currVal_2;
        }
    }
}

@slmyers Thats exactly what is happening here, and why we don't see .name or a reflective property access (this[prop]) anywhere in the compiled code. * checkBinding is just an equality check. The example of this is accessing this._expr_2 .

Is it possible to see an entire compiled app?