Javascript 角度2：基于条件切换布尔值

我有一个搜索栏，当输入值长度为2或更长时，我想显示所有过滤的名称

我设法从输入字段中获取

值.length

。现在我被卡住了。 起初我做了：

if (value.length >= 2){
  showNames: true;
} 

默认值

showNames

为false。当长度为2或更大时，它设置为true。所以，这是有效的。只有当用户擦除文本，使value.length再次小于2时，布尔值才会再次变为false。我试过了，但我知道这在Angular 2中是不正确的

<ion-searchbar (ionInput)="getNames($event)"></ion-searchbar>
<ion-list *ngIf="showNames">
   <ion-item *ngFor="let name of names">
     {{ name }}
   </ion-item>
</ion-list>

{{name}}

我知道我可以通过单击按钮来切换布尔值，但我只想从值的长度来切换布尔值

*ngIf=“value.length>=2”

也不起作用，因为我在Typescript中创建了变量“value”。所以在我的HTML中它没有定义。我不想用大公式来计算长度，这就是为什么我创建了一个变量

我怎么能这样呢

将变量“value”从我的Typescript传递到我的HTML，这样我就可以使用

*ngIf=“value.length>2”

或者在我的Typescript中执行某种If/Else，这样我就可以在HTML中使用一个布尔值，比如

*ngIf=“showNames”

---

您可以将

showNames

作为一个函数，并以执行

*ngIf=“showNames（）”

为目标，或者如果它很短，请立即执行检查：

*ngIf=“value.length>=2”

您可以像这样绑定到搜索栏的模型：

<ion-searchbar [(ngModel)]="searchValue" (ionInput)="getNames($event)"></ion-searchbar>
<ion-list *ngIf="searchValue.length >= 2">
   <ion-item *ngFor="let name of names">
     {{ name }}
   </ion-item>
</ion-list>

export class ComponentA {
    searchValue: string = "";

    // ...
}