页面上未显示组件变量（Angular6）

Question

所以事情是：角度组件的html模板似乎不知道我设置的变量。基本上，即使我在.ts类中设置了一个变量，然后尝试将其显示在组件中，该视图的行为也就好像没有变量一样。

我也尝试过在标签内创建变量，但这根本行不通

TS The ts part of a component

export class <%component_name%> {
  bar = "test";
  constructor(){...}
} 

HTML The html part of a component

<div>
    <div>{{bar}}</div>
</div>

The result is:

以防万一：如果我在div中键入文本而不尝试显示变量，那么它会起作用

HTML Result

哦，以防万一：在构造函数中记录hello变量确实会在控制台中显示它：click

此外，如果我添加* ngIf引用TS文件中的某些布尔值，例如：

TS

export class <%component_name%> {
  foo = true;
  bar = "test";
  constructor(){...}
} 

HTML

<div *ngIf="foo">
    <button>{{bar}}</button>
</div>

..然后什么也不显示。

最后应该是一个带有图标和文本的按钮，但我在按钮上只得到一个图标（在.html文件中被引用）

如果您对可能发生的事情有任何了解，请告知