Question

所以我学习了角度知识，开始使用switch语句，但是我对关于引号makrs 的switch语句的div标签分配感到困惑。这是html代码：

<div [ngSwitch]="color">
  <div *ngSwitchCase="red">You picked red color</div>
  <div *ngSwitchCase="blue">You picked blue color</div>
  <div *ngSwitchCase="green">You picked green color</div>
</div>

并且我在color文件中声明了变量.ts

export class StructuralDividesComponent implements OnInit {
public color="red"; 
constructor() { }

ngOnInit() {
}

}

为什么仅当color的值位于"'red'"而不是"red"时，此代码才起作用。

Answer 1

我认为这是javaScript的核心概念。当您给* ngSwitchCase =“ red”时，它将尝试从其组件中查找红色变量并替换该值。但是，如果要将其与字符串值匹配，则必须写* ngSwitchCase =“'red'”

有关更多信息，您可以看到-> When to use double or single quotes in JavaScript?

Answer 2

据我所知，当您声明*ngSwitchCase="'red'"时，红色被认为是字符串，而angular不会在组件的属性中搜索它。如果声明*ngSwitchCase="red"，则它将其视为变量（组件的属性），并尝试在组件内部找到它。换句话说，角度期望在其所有本地指令中都包含一个javascript。

使用“”和“”分配标签之间的区别

2 个答案: