PrimeNG TypeError "this._activeIndex.includes" не является функцией - PullRequest
0 голосов
/ 12 ноября 2018

У меня есть компонент, в котором я использую аккордеон. Я хочу включить несколько вкладок и пользовательский activeIndex.Вот мой код:

<p-accordion [activeIndex]="index" [multiple]="true">
  <p-accordionTab header="1st tab">
    1st tab content
  </p-accordionTab>
  <p-accordionTab header="2nd tab">
    2nd tab content
  </p-accordionTab>
</p-accordion>

Вот мой класс компонентов

@Component({
  selector: 'app-panel',
  templateUrl: './panel.component.html',
  styleUrls: ['./panel.component.css']
})
export class PanelComponent implements OnInit {

  index:number = 1;
  constructor() { 
  }


  ngOnInit() {
    //this.index = 0;
  }

}

Проблема появляется, если я хочу включить и [activeIndex] и [несколько]. Любые идеи, почему этопроисходит?

Я использую PrimeNG 7 и угловой 7

Ответы [ 2 ]

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

Документы говорят:

Индекс активной вкладки или массив индексов для изменения выбранной вкладки. программным способом.

Вот код, связанный с , где он устанавливает активные вкладки с _activeIndex

 updateSelectionState() {
        if (this.tabs && this.tabs.length && this._activeIndex != null) {
            for (let i = 0; i < this.tabs.length; i++) {
                let selected = this.multiple ? this._activeIndex.includes(i) : (i === this._activeIndex);
                let changed = selected !== this.tabs[i].selected;

                if (changed) {
                    this.tabs[i].animating = true;
                }

                this.tabs[i].selected = selected;
                this.tabs[i].selectedChange.emit(selected);
            }
        }
    }

Итак, для нескольких вкладок вы должны использовать массив индексов, а не число.

@Component({
  selector: 'app-panel',
  templateUrl: './panel.component.html',
  styleUrls: ['./panel.component.css']
})
export class PanelComponent implements OnInit {

  indices: number[] = [1, 2];
  constructor() { 
  }


  ngOnInit() {
    //this.index = 0;
  }

}

Если вам интересно, this._activeIndex.includes(i) вот откуда ваша ошибка.

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

Вы не можете использовать оба.Это либо одно, либо другое.

multiple: если этот параметр включен, можно одновременно активировать несколько вкладок.

activeIndex: индекс активной вкладки или массив индексов.изменить выбранную вкладку программно.

Из-за того, как они работают, они будут противоречить друг другу.Один должен иметь несколько открытых, другой - только один открытый.

https://www.primefaces.org/primeng/#/accordion

Например:

Представьте, что у вас есть функция, которая говорит openDoor() и тот, который называется closedDoor(), если вы используете их в ЖЕ ВРЕМЯ , они будут противоречить друг другу.

Это то, что вам нужно:

<p-accordion [multiple]="true" >
    <p-accordionTab header="Header 1" [selected]="true">
        Content 1
    </p-accordionTab>
    <p-accordionTab header="Header 2">
        Content 2
    </p-accordionTab>
    <p-accordionTab header="Header 3">
        Content 3    
    </p-accordionTab>
</p-accordion>
...