Question

我有一个问题。我想在我的评级类型中显示某些html元素。我的组件中的属性是一个数字。否则我希望它显示其他元素。我尝试了以下方法：

<div class="col">
    <div [ngSwitch]="rating">
        <div *ngSwitchCase="null" ngbDropdown class="d-inline-block">
            <button class="btn btn-outline-primary" ngbDropdownToggle>Rate The Movie!</button>
            <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
                <button value="1" (click)="addRating(1)" class="dropdown-item">1</button>
                <button value="2" (click)="addRating(2)" class="dropdown-item">2</button>
                <button value="3" (click)="addRating(3)" class="dropdown-item">3</button>
                <button value="4" (click)="addRating(4)" class="dropdown-item">4</button>
                <button value="5" (click)="addRating(5)" class="dropdown-item">5</button>
            </div>
            </div>
                <div *ngSwitchCase="typeof === number">
                    <h1>{{rating}}</h1>
                </div>
            </div>
       </div>

不幸的是

* ngSwitchCase =＆＃34; typeof === number＆＃34;

不起作用。有人知道怎么做吗？我知道我可以使用ngIf，但在以后的状态下我想添加更多选项，这就是我选择ngswitch的原因。

Answer 1

我认为ngSwitch不适合您的情景。

为什么不使用ngIf？

<div *ngIf="rating === null" ...>
//...
<div *ngIf="rating !== null && typeof rating === 'number'">

如果你真的想使用ngSwitch，如果你只有2个案例（空或数字），那么使用ngSwitchDefault处理数字案例。但是一个ngIf是更清洁的imho

Answer 2

typeof是一个需要传递的运算符＆＃39;检查类型。它还以字符串形式提供答案。所以你可能想要：

<div *ngSwitchCase="typeof rating === 'number'">

请参阅：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof

Ngswitch：在typeof＆＃39; rating＆＃39;时显示元素。是一个数字

2 个答案: