Angular2 child property change not firing update on bound property : <p>I have a simple custom directive with an input, that I'm binding to in my component. But for whatever reason, the ngOnchanges() method doesn't fire when changing a child property of the input property.</p>

<p>my.component.ts</p>

<pre><code>import {Component} from 'angular2/core';
import {MyDirective} from './my.directive';

@Component({
    directives: [MyDirective],
    selector: 'my-component', 
    templateUrl: 'Template.html'
})

export class MyComponent {
    test: { one: string; } = { one: "1" }

    constructor( ) {
        this.test.one = "2";
    }
    clicked() {
        console.log("clicked");
        var test2: { one: string; } = { one :"3" };
        this.test = test2; // THIS WORKS - because I'm changing the entire object
        this.test.one = "4"; //THIS DOES NOT WORK - ngOnChanges is NOT fired=
    }
}
</code></pre>

<p>my.directive.ts</p>

<pre><code>import {Directive, Input} from 'angular2/core';
import {OnChanges} from 'angular2/core';

@Directive({
    selector: '[my-directive]',
    inputs: ['test']
})

export class MyDirective implements OnChanges {
    test: { one: string; } = { one: "" }

    constructor() { }

    ngOnChanges(value) {
        console.log(value);
    }
}
</code></pre>

<p>template.html</p>

<pre><code>&lt;div (click)="clicked()"&gt; Click to change &lt;/div&gt;
&lt;div my-directive [(test)]="test"&gt;
</code></pre>

<p>Can anyone tell me why?</p>
