Question

首先，请原谅我的英语不好。我正在使用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是。我以反击者的形式替换这个值，角度代替名称。图书馆NG-ZORRO有选项[nzDeseble]，但这并不是我需要的。

如何使管理员在下拉列表中隐藏的值无法选择，但如果值存储在模型中，则会显示在控件中。我想它需要在form.value中以某种方式替换，但这样的决定将需要在架构上进行重大改变。你有什么建议？

Angular 5 ng-option只读项目

0 个答案: