Угловой сброс значений раскрывающихся значений - PullRequest
Новая
       6

Угловой сброс значений раскрывающихся значений

0 голосов
/ 23 ноября 2018

Здравствуйте, сообщество! Мне нужна помощь с компонентами Angular и Primeng, сценарий следующий.

У меня есть модель: 

export class Properties {
    public IdFittingConnector: number;
    public IdProperty: number;
    public IdGroup: number;
    public OrderAparitionNumber: number;
    public OrderCodePos: number;
    public ConnectorDescription: string;
    public PropertyDescription;
    public Values: FittingPropertiesValues[];
    public Disabled: boolean;
    public SelectedData: FittingPropertiesValues;
}

Эта модель хранится в массиве, поэтому foreachэлемент в массиве я создаю выбор / выпадающий 

<div *ngFor="let item of arrFittingsCombos;  let i = index">
    <h4>{{item.PropertyDescription}}</h4>
    <p-dropdown [(disabled)]="item.Disabled" [options]="item.Values" optionLabel="IrredutibleFractionValue" [(ngModel)]="item.SelectedData" [showClear]="true" (onChange)="OnFittingComboChange($event)" placeholder="Select Item" [style]="{'width':'100%'}"></p-dropdown>
</div>

Как вы можете видеть, ребята, в модели у меня есть реквизит, который хранит выпадающие значения под названием «Значения» и на той же модели я сохраняю выбранныйОпция на опоре называется "SeloectedData".

Теперь большое дело следующее.

У меня есть пара проверок, и проблема в том, что у меня есть два выпадающих списка, но если второе значение> первое значение сброса, мне нужно сбросить второй выпадающий список.Я показываю вам логический код ... 

if (selectedOption.IdProperty == 5) {
    let diam: number = this.arrFittingsCombos.filter(x => x.IdProperty == 1)[0].SelectedData.NumberValue;

    if (selectedOption.NumberValue > diam) {
        alert("Seleccion invalida, la selección es mayor que el primer diametro");
        this.arrFittingsCombos.filter(x => x.IdProperty == 5)[0].SelectedData = null;
        this.searchBtnDisabled = true;
    }
}

Как вы можете видеть, я сбрасываю [(ngModel)], и в действительности это происходит, но в раскрывающемся списке отображаемая метка все еще существует.Что я делаю не так?Если в первый раз проверки были в порядке, значение First DropDown значение первого DropDown, поведение является желательным, но после этого отображаемая метка больше не сбрасывается.

Большое спасибо за ваше время, и я надеюсь, что вы можете дать мне немного света.

Ответы [ 2 ]

0 голосов
/ 23 ноября 2018

У меня есть решение в HTML, я добавил угловой идентификатор: 

#dropdown_i 

<div *ngFor="let item of arrFittingsCombos;  let i = index">
    <h4>{{item.PropertyDescription}}</h4>
    <p-dropdown #dropdown_i [(disabled)]="item.Disabled" [options]="item.Values" optionLabel="IrredutibleFractionValue" [(ngModel)]="item.SelectedData" [showClear]="true" (onChange)="OnFittingComboChange($event, drop_i)" placeholder="Select Item" [style]="{'width':'100%'}"></p-dropdown>
</div>

, затем в машинописном коде я получаю раскрывающийся список параметров. 

OnFittingComboChange(event, dropdown: Dropdown) {
  //TODO logic code here...
}

наконециспользуя метод раскрывающегося списка под названием dropdown.clear(), я могу сбросить выбранную опцию. 

if (drop.value != null &&  selectedOption.IdProperty == 5) {
    let diam: number = this.arrFittingsCombos.filter(x => x.IdProperty == 1)[0].SelectedData.NumberValue;

    if (selectedOption.NumberValue > diam) {
        this.messageService.add({ severity: 'warn', summary: 'Validación', detail: 'Seleccion invalida, la selección es mayor que el primer diametro' });
        drop.clear(null);
        this.searchBtnDisabled = true;
    }
}

теперь, когда условие в порядке, элемент очищается правильно и поведение является желаемым.

0 голосов
/ 23 ноября 2018

почему это не работает

Это потому, что вы изменили свойство SelectedData в новом array.

Вызов .filter для массива всегда возвращает отфильтрованную копию массива.Поэтому, когда вы изменяете это, ngModel не знает об этом.

возможное решение

Я работаю в основном в реакции, поэтому я не уверен, что изменяю свойствона вашем классе экземпляр "принят" угловым.Но давайте предположим, что это ...

Что вы можете сделать, это заменить arrFittingsCombos на ваш мутированный массив, например: 

const newArray = this.arrFittingsCombos.filter(x => x.IdProperty == 5)

newArray[0].SelectedData = null

this.arrFittingsCombos = newArray
...