Angular 4 - 将数据库中的布尔值绑定到切换开关 on/off
Angular 4 - Bind boolean values from db to toggle switch on/off
在应用程序中,我有一个切换开关,它必须绑定到数据库中的数据。数据库中的名称是 Status,它的值为 True/False。现在我想在我的 table 行中使用切换开关按钮,如果从数据库中检索到的状态为真,它应该显示绿色,如果数据库中的状态为假,它应该显示黑色。我试过 ngModel 但它不起作用。不管怎样,如果我在 DB 中有 true 或 false,只有当我在屏幕上渲染时它才会显示为 false。对于拨动开关,我必须使用自己的组件。下面是我的代码。
html
<ng-container *ngFor="let data of displayData$ | async;let i = index">
<tr class= "row-break">
<form>
<p>
<cm-toggle-switch [(ngModel)]="data.Status" name="switch1" ></cm-toggle-switch>
</p>
</form>
</tr>
</ng-container>
DB-
export interface data[
{object:1,
Status:true;},
{object:2,
Status:false;}
]
但是当我写 {{data.Status}} 时,它显示 true,false 作为 Status perfect 的值。将值绑定到我的开关我哪里出错了。任何帮助。
切换开关文档 -
<p>
<toggle-switch [(ngModel)]="formModel.switcher" name="switch1">Main power</toggle-switch>
</p>
formModel: any = {
switcher: true
};
<ng-container *ngFor="let data of displayData$ | async;let i = index">
<tr class= "row-break">
<form>
<p [style.color]="data.Status == true ? 'green' : 'black'">
<cm-toggle-switch [(ngModel)]="data.Status" name="switch1" ></cm-toggle-switch>
</p>
</form>
</tr>
</ng-container>
可以试一试吗?
在应用程序中,我有一个切换开关,它必须绑定到数据库中的数据。数据库中的名称是 Status,它的值为 True/False。现在我想在我的 table 行中使用切换开关按钮,如果从数据库中检索到的状态为真,它应该显示绿色,如果数据库中的状态为假,它应该显示黑色。我试过 ngModel 但它不起作用。不管怎样,如果我在 DB 中有 true 或 false,只有当我在屏幕上渲染时它才会显示为 false。对于拨动开关,我必须使用自己的组件。下面是我的代码。
html
<ng-container *ngFor="let data of displayData$ | async;let i = index">
<tr class= "row-break">
<form>
<p>
<cm-toggle-switch [(ngModel)]="data.Status" name="switch1" ></cm-toggle-switch>
</p>
</form>
</tr>
</ng-container>
DB-
export interface data[
{object:1,
Status:true;},
{object:2,
Status:false;}
]
但是当我写 {{data.Status}} 时,它显示 true,false 作为 Status perfect 的值。将值绑定到我的开关我哪里出错了。任何帮助。
切换开关文档 -
<p>
<toggle-switch [(ngModel)]="formModel.switcher" name="switch1">Main power</toggle-switch>
</p>
formModel: any = {
switcher: true
};
<ng-container *ngFor="let data of displayData$ | async;let i = index">
<tr class= "row-break">
<form>
<p [style.color]="data.Status == true ? 'green' : 'black'">
<cm-toggle-switch [(ngModel)]="data.Status" name="switch1" ></cm-toggle-switch>
</p>
</form>
</tr>
</ng-container>
可以试一试吗?