[英]String interpolation not working Angular 7
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.属性
totalprofiles
是我组件中的一个简单数字字段,但是它不会插入卡片或 html 模板中的任何位置。 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).
我使用的是 Angular CLI 版本 (7.0.2)。
Update --更新 -
After doing multiple tries I can confirm that nothing seems wrong with the html
template.多次尝试后,我可以确认
html
模板似乎没有任何问题。 I replaced the html template with the below code -我用下面的代码替换了 html 模板 -
<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.
仍在试图弄清楚,我会在更多研究后更新。
I had the same problem and i fixed it declaring the type of the variable declared to any.我遇到了同样的问题,我修复了它,声明了声明为 any 的变量的类型。
export class Dashboard2Component {
totalprofiles:any = 100;
}
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.
虽然这更像是一种解决方法,但它确实解决了问题。
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 .这可能是您的编辑器在使用实时服务器时的问题,angular 在端口号 http://localhost:4200/ 中运行,您的 ide 实时服务器可能在不同的端口上运行。
first solution ,directly run your project with this http://localhost:4200/第一个解决方案,直接用这个 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.第二种解决方案,如果它是 vscode 编辑器中的实时服务器,请使用 , ng serve --port5500 ,或者使用您最喜欢的 Ide 默认使用的端口号,如上所述。
ng serve --port; ng服务--端口;
this will resolve your issue.这将解决您的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.