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

Question

所以即时学习角度并转而转换语句，但是我对关于引用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'"时，红色被认为是一个字符串，而角度不会在组件的属性中搜索它。如果你声明*ngSwitchCase="red"然后它认为它是一个变量（组件的属性）并试图在组件内找到它。换句话说，angular需要在其所有本机指令中使用javascript。