angular 6: DynamicSelectModel, программно установить selectedValue с помощью машинописного текста - PullRequest
0 голосов
/ 10 января 2019

Мне нужно дважды щелкнуть строку, чтобы получить адекватное поведение, похоже, что мой inputModel.valueUpdates.next(aSelectedValue) не выполняет адекватную работу по обновлению параметров inputModel, а затем выполняет обновление selectedIndex. Я не прав, как я это использую? Даже если вызвать 2 раза inputModel.valueUpdates.next(aSelectedValue), он попадает в наблюдаемые объекты и, конечно, не запускается правильно, поэтому во второй раз selectedIndex будет обновляться

Создание компонента

Создание вызвано моим someComponent.ts с

public static getCategoriesSelect(aSelectId: string, aSelectedValue: any, aDefaultObj: Enumerate): DynamicSelectModel<string>{
    const selectOptions = [{label:'loading...', value:'-1'}]
    var selectConfig = {
        disabled: false,
        hidden: false,
        id: aSelectId,
        label: 'Category',
        labelTooltip: 'Select a category',
        controlTooltip: 'someControlTooltip',
        name: 'CategoryName',
        options: selectOptions,
        value: aSelectedValue,
        compareWithFn: (o1: any, o2: any) => {
            var result = false
            if (o1 != null && o2 != null){
            result = o1.toString() === o2.toString()
            }
            console.debug('compareWithFn:'+aSelectId+':', o1, o2, result)
            return result
        }, 
        placeholder: 'Sample placeholder like select an option',
    }    

    var result = new DynamicSelectModel(selectConfig)

    return result
}

и затем, заполняя опции из API, конечно же, асинхронно, я бы хотел, чтобы в моей функции обратного вызова обновлялись не только опции, заполненные из БД из API, но и устанавливался выбранный индекс.

onRowClicked ()

Единственный способ сделать это в моем someComponent.ts, который вызывается onRowClicked таблицы, - это

protected _setFormSelectOptions(anOptionsArray: any[], aFormId: string, aFormControlModelsArray: DynamicFormControlModel[], aWithNone?: boolean, aSelectedValue?: any){
    this._selectOptions = []
    //Filling Options
    if (aWithNone){
        var lNoneOption: any = {
            label: 'Category itself',
            value: 0
        }
        this._selectOptions.push(lNoneOption)
    }
    //Filling Select
    anOptionsArray.forEach(lVal => {
        this._selectOptions.push(lVal)
    });
    const inputModel = this.formService.findById(aFormId, aFormControlModelsArray) as DynamicSelectModel<string>

    if (inputModel == null) {
        throw new Error('_setFormSelectOptions->InputModel is null, key not found into entityEditFormCtlModel:'+ aFormId)
    }else{
        inputModel.options = this._selectOptions
        inputModel.disabled = false
        //Selected index
        if (isNaN(aSelectedValue)){
            aSelectedValue = 0
        }
        //inputModel.value = 'fromFormSelectOptions' //Not working but replaced by the next(someValueWhichWillBePassedToCompareWithFn) function
        console.debug('_setFormSelectOptions->inputModel->'+aFormId+':', inputModel)
        console.debug('_setFormSelectOptions->compareWithFn aSelectedValue:'+aFormId+':', aSelectedValue)
        inputModel.valueUpdates.next(aSelectedValue)
        //this.entityAddFormGroup = this.formService.createFormGroup(aFormControlModelsArray) //Doesn't work either
    }
}

с component.html

  <form *ngIf="entityEditFormGroup && currentEntity" [formGroup]="entityEditFormGroup">
    <h2 i18n>Edit #{{currentEntity.id}}</h2>
    <dynamic-material-form [group]="entityEditFormGroup" [model]="entityEditFormCtlModelArray"></dynamic-material-form>
    <button (click)="buttonEditEntityClicked(entityEditFormGroup.value)">Save</button>
  </form>
...