Reputation: 5659
I am trying to display a dynamic property in my card value as below -
<div class="card-block pt-2 pb-0">
<div class="media">
<div class="media-body white text-left">
<h3 class="font-large-1 mb-0">{{totalprofiles}}</h3>
<span>Total Cost</span>
</div>
<div class="media-right white text-right">
<i class="icon-bulb font-large-1"></i>
</div>
</div>
</div>
The property totalprofiles
is a simple number field in my component, however it doesn't get interpolated in the card or any where in the html template. Below is the code from component
@Component({
selector: 'app-dashboard2',
templateUrl: './dashboard2.component.html',
styleUrls: ['./dashboard2.component.scss']
})
export class Dashboard2Component {
totalprofiles = 100;
}
I am trying to figure out why. I am using Angular CLI version (7.0.2).
Update --
After doing multiple tries I can confirm that nothing seems wrong with the html
template. I replaced the html template with the below code -
<div>
<h3>{{totalprofiles}}</h3>
</div>
Even this doesn't seem to be working, so I guess it is something with the component. Still trying to figure out and I will update after some more research.
Upvotes: 0
Views: 6727
Reputation: 1
this might be the issue with your editor while using live server ,angular runs in port number http://localhost:4200/ your ide live server might run on different port .
first solution ,directly run your project with this http://localhost:4200/
second solution , make use of , ng serve --port5500 if its a live server in vscode editor, or use the port number that your favorite Ide uses by default as mentioned above.
ng serve --port;
this will resolve your issue.
Upvotes: 0
Reputation: 63
I had the same problem and i fixed it declaring the type of the variable declared to any.
export class Dashboard2Component {
totalprofiles:any = 100;
}
Upvotes: 2
Reputation: 5659
This was difficult to figure out and I couldn't find any answer, however I was able to solve the problem by creating another component and copying the template and component code from old components. Though this was more of a work-around but it did solve the problem.
Upvotes: 0