<p dir="auto"><strong>I'm submitting a ...</strong>  (check one with "x")</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[x] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question"><pre class="notranslate"><code class="notranslate">[x] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
</code></pre></div>
<p dir="auto"><strong>Current behavior</strong><br>
Route params at parent level change, child level resolver is called to resolve new data, but route data observers are not notified that data has changed.<br>
See <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="190078450" data-permission-text="Title is private" data-url="https://github.com/angular/angular/issues/12942" data-hovercard-type="issue" data-hovercard-url="/angular/angular/issues/12942/hovercard" href="https://github.com/angular/angular/issues/12942">#12942</a> where this issue as initially titled was fixed but the actual use case is still broken (I never tested the fix as the initial feedback was that the issue wasn't going to be fixed so prior to the fix landing I had already changed my routing to avoid this issue. Now attempting to refactor the resulting strange routing configuration and finding that the issue is still there)</p>
<p dir="auto"><strong>Expected behavior</strong><br>
Route observers would be given the newly resolved data</p>
<p dir="auto"><strong>Minimal reproduction of the problem with instructions</strong></p>

<p dir="auto">See <a href="https://github.com/slubowsky/resolve-issue">https://github.com/slubowsky/resolve-issue</a><br>
Run the app (ng serve). Click on the links to navigate. Resolver is called every navigation regardless of whether parent or child param changes and a message is logged to the console "FooResolve ..."</p>
<p dir="auto">Component which has subscribed for route data is only notified (as evidenced by the console messages) when the child param changes.</p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong><br>
Having resolver re-resolve the data without letting the components know is kind of useless...</p>
<p dir="auto"><strong>Please tell us about your environment:</strong></p>

<ul dir="auto">
<li><strong>Angular version:</strong> 2.0.X</li>
</ul>

<p dir="auto">@angular/cli: 1.0.0<br>
node: 7.8.0<br>
os: win32 x64<br>
@angular/common: 4.0.1<br>
@angular/compiler: 4.0.1<br>
@angular/core: 4.0.1<br>
@angular/forms: 4.0.1<br>
@angular/http: 4.0.1<br>
@angular/platform-browser: 4.0.1<br>
@angular/platform-browser-dynamic: 4.0.1<br>
@angular/router: 4.0.1<br>
@angular/cli: 1.0.0<br>
@angular/compiler-cli: 4.0.1</p>
<ul dir="auto">
<li><strong>Browser:</strong> [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]</li>
</ul>

<ul dir="auto">
<li>
<p dir="auto"><strong>Language:</strong> [all | TypeScript X.X | ES6/7 | ES5]</p>
</li>
<li>
<p dir="auto"><strong>Node (for AoT issues):</strong> <code class="notranslate">node --version</code> =</p>
</li>
</ul>
<p dir="auto">in my application I have a json object which is hardcoded. that values are bound with the input controls in the view. but if i changes the values of the json object during/based on some events, then those changes values are not getting reflected in the view/input controls? how do i forcefully reload/refresh the view?</p>
<p dir="auto">please look the component below. In that the values which i have assigned inside the constructor gets reflected in the view during the load of the component.<br>
based on some events on the parent component, the method LoadExtractorQueueDetails is called and the same variable this.sampleData is being set with some other values.<br>
ideally i expect these values to be reflected in the view? but this doesn't seem to happen?<br>
why it is not happening? how do i reload/refresh the views ?</p>
<p dir="auto">`import { Component, Input, OnInit } from '@angular/core'<br>
import { FORM_DIRECTIVES } from '@angular/common';</p>
<p dir="auto"><a class="user-mention notranslate" data-hovercard-type="organization" data-hovercard-url="/orgs/component/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/component">@component</a>({<br>
selector: 'extractorQueueDetails',<br>
directives: [FORM_DIRECTIVES],<br>
templateUrl: './HTML/Admin/ExtractorQueueDetails.html'<br>
})<br>
export class ExtractorQueueDetails {</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="resultData: ExtractorQueueItem;
sampleData: Sample;

constructor() {
    console.log(&quot;ExtractorQueueDetails component is loaded&quot;);

    this.sampleData = { queueId: 123, name: &quot;Krishnan&quot; };
 }
public LoadExtractorQueueDetails() {
    this.sampleData = { queueId: 456, name: &quot;Krishnan123&quot; };
}"><pre class="notranslate"><code class="notranslate">resultData: ExtractorQueueItem;
sampleData: Sample;

constructor() {
    console.log("ExtractorQueueDetails component is loaded");

    this.sampleData = { queueId: 123, name: "Krishnan" };
 }
public LoadExtractorQueueDetails() {
    this.sampleData = { queueId: 456, name: "Krishnan123" };
}
</code></pre></div>
<p dir="auto">}`</p>
<p dir="auto">My HTML template is like below<br>
<code class="notranslate">&lt;input type="text" name="txtQueueID" class="form-control" id="txtQueueID" [(ngModel)]="sampleData.queueId" /&gt; &lt;input type="text" name="Description"  class="form-control" [(ngModel)]="sampleData.name" id="Description" /&gt;</code></p>