I'm not sure why the change detection wouldn't work here. I've tried a few things, including a setTimeout. I'm using RC5. Basically I want to change the content based off of a parameter in my URL. Should be pretty simple right?
thanks.ts
import { Component } from '@angular/core';
import { Card } from '../../components/card/card';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'sd-thanks',
styleUrls: ['thanks.css'],
directives: [Card],
templateUrl: 'thanks.html'
})
export class Thanks {
params: any;
coming: any;
constructor(public route: ActivatedRoute) {
this.params = this.route.params.subscribe(
params => {
this.coming = params['coming'];
console.log(this.coming); // this consoles the correct true/false value
}
);
}
}
thanks.html
<card>
<div *ngIf="coming" class="card-content">
<span class="card-title">We can't wait to see you!</span>
</div>
<div *ngIf="!coming" class="card-content">
<span class="card-title">We will certainly miss you!</span>
</div>
</card>
Since ActivatedRoute can be reused, ActivatedRouteSnapshot is an immutable object representing a particular version of ActivatedRoute . It exposes all the same properties as ActivatedRoute as plain values, while ActivatedRoute exposes them as observables.
Difference between activatedroute and routerstateActivatedRoute interface provides access to information about a route associated with a component that is loaded in an outlet. Use to traverse the RouterState tree and extract information from nodes.
Params can only be strings because they come from the URL
If you change it to
this.coming = params['coming'] && params['coming'].toLowerCase() === 'true';
it should work.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With