如果字段值为空,则有破折号
Having a dash if field values are null
我正在开发 angular 应用程序。我的 html
中有以下代码
<div>{{ data.date | date:'d-MMM-y' || '-' }}</div>
<div>{{ data.id || '-' }}</div>
我面临的问题是,无论何时对于日期和 id 等任何字段,如果来自 API 的值为空,那么下一个 div 向上移动。我希望 div 位于值不为空时的那个特定位置。因此,每当来自 API 的值为空时,我都希望有一个破折号“-”。所以在我的代码中,我向所有字段添加了一个 || '-'
但它仍然不起作用。我的 html 中没有出现“-”。我该怎么做?
您可以在这种情况下使用 nullish coalescing 运算符
它将像:
<div> {{ (data.date | date:'d-MMM-y') ?? '-' }} </div>
<div> {{ data.id ?? '-' }} </div>
你已经接近结果了,只是少了一些括号:
<div>{{ (data?.date) ? (data.date | date:'d-MMM-y') : '-' }}</div>
工作 Stackblitz:https://stackblitz.com/edit/angular-vb4peg?file=src/app/app.component.ts
只需注释行 this.data["date"] = new Date();
,您就会看到它的变化。
我正在开发 angular 应用程序。我的 html
中有以下代码 <div>{{ data.date | date:'d-MMM-y' || '-' }}</div>
<div>{{ data.id || '-' }}</div>
我面临的问题是,无论何时对于日期和 id 等任何字段,如果来自 API 的值为空,那么下一个 div 向上移动。我希望 div 位于值不为空时的那个特定位置。因此,每当来自 API 的值为空时,我都希望有一个破折号“-”。所以在我的代码中,我向所有字段添加了一个 || '-'
但它仍然不起作用。我的 html 中没有出现“-”。我该怎么做?
您可以在这种情况下使用 nullish coalescing 运算符
它将像:
<div> {{ (data.date | date:'d-MMM-y') ?? '-' }} </div>
<div> {{ data.id ?? '-' }} </div>
你已经接近结果了,只是少了一些括号:
<div>{{ (data?.date) ? (data.date | date:'d-MMM-y') : '-' }}</div>
工作 Stackblitz:https://stackblitz.com/edit/angular-vb4peg?file=src/app/app.component.ts
只需注释行 this.data["date"] = new Date();
,您就会看到它的变化。