1

首先,请原谅我的英语不好。我正在使用 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 但这样的决定将导致架构的巨大变化。你有什么建议?

4

0 回答 0