首先,请原谅我的英语不好。我正在使用 NG-ZORRO 在 ASP.NET Core 2 WebApi 和 Angular 上编写应用程序。
一般来说,我对下拉列表有疑问。根据职权范围,管理员可以将目录中的一项标记为隐藏,同时它不应该可供选择或不应该传达给客户端。但是在之前创建的应用程序卡片中,即使它们被标记为缓存在数据库中,也应该显示这些值。这是我们公司的一位非常酷的业务分析师。
因此,我在 SQL 中有一个模型目录(id、name、isDeleted)。当用户打开一张申请卡时,他会收到所有之前填写的 ID。
其中之一。为了方便只留下一个控制器:
<div nz-form-control nz-col [nzLg]="18"
[nzValidateStatus]="typeServices">
<nz-select formControlName="typeServices"
[nzPlaceHolder]="'Выберите вид услуги'"
[nzNotFoundContent]="'Услуга не найдена'"
nzShowSearch>
<nz-option *ngFor="let option of typeServicesList"
[nzLabel]="option.name"
[nzValue]="option.id">
</nz-option>
</nz-select>
<div nz-form-explain *ngIf="(typeServices.dirty || typeServices.touched)
&& typeServices.errors?.required">
Пожалуйста, введите вид услуги!
</div>
</div>
我的组件:
export class CardDetailsInfoComponent implements OnInit, OnDestroy {
private ngUnsubscribe: Subject<void> = new Subject<void>();
form: FormGroup;
typeServicesList = [];
get typeServices() { return this.form.controls.typeServices; }
constructor(
private formBuilder: FormBuilder,
private tabDetailsStore: TabDetailsStore,
private readonly httpCardService: ApplicationCardHttpService,
private cardService: ApplicationCardService,
private realizationRatingBackendService: RealizationRatingBackendService) {
this.cardService.cardOnChange
.takeUntil(this.ngUnsubscribe)
.subscribe(card => {
this.typeServicesList = this.cardService.cardReferences.servicetypes;
this.typeServices.setValue(card.serviceTypeId);
});
this.cardService.onSaved()
.takeUntil(this.ngUnsubscribe)
.subscribe(() => {
if (this.tabDetailsStore.activeTab.type === TabDetailsType.CommonInfo) {
if (this.form.valid) {
this.cardService.setServiceTypeId(this.typeServices.value);
this.save();
} else {
this.cardService.saveCompleted(SaveStatus.Undefined);
}
}
});
}
private save() {
return this.httpCardService.saveMainData(this.cardService.card)
.subscribe(() => {
this.cardService.saveCompleted(SaveStatus.Successful);
}, (err: HttpErrorResponse) => {
this.cardService.saveCompleted(SaveStatus.Error);
console.log(err);
});
}
ngOnInit() {
this.form = this.formBuilder.group({
typeServices: [null, Validators.compose([Validators.required]), null]
});
}
ngOnDestroy() {
this.ngUnsubscribe.next();
this.ngUnsubscribe.complete();
}
我从服务器获取卡的型号,其中目录的所需项目的 id 是。我以 counterlighter 的形式替换了这个值,而 angular 替换了名称。图书馆 NG-ZORRO 有选项 [nzDeseble] 但这并不是我所需要的。
如何使下拉列表中管理员隐藏的值无法选择,但如果该值存储在模型中,则显示在控件中。我想它需要以某种方式替换为 form.value 但这样的决定将导致架构的巨大变化。你有什么建议?