ngOnChanges Angular 2 не назначает разные значения - PullRequest
0 голосов
/ 20 сентября 2018

У меня есть общедоступное значение cursorUrl и метод, который проверяет, существует ли URL, и если он существует, он присваивает urlCursor='pointer', если он не существует, он присваивает urlCursor='text'.

Метод, кажется,работает нормально, однако он присваивает каждому элементу urlCursor='pointer', хотя консольный журнал выводит мне, что это должно быть

pointer
text
text
text

, это мой метод:

ngOnChanges(changes: any) {
    let index = 0;
    this.urlCursor = 
        this.checkUrl(changes.items.currentValue[0].redirectionViewUrl);
    index++; 
    console.log(this.urlCursor);
}

и это html:

<div class="items" #item(window:resize)="itemResizeHandler();" >
    <app-item
        *ngFor="let item of items"
        class="item-element"
        [ngStyle]="{'cursor': urlCursor}"
        [dataMode]="item.dataMode"
        [redirectionViewUrl]="item.redirectionViewUrl"
    ></app-item>
</div>

Кто-нибудь знает, почему он не связывает должным образом?

1 Ответ

0 голосов
/ 20 сентября 2018

Привязка работает правильно.Ваш urlCursor - это не массив переменных, а одна переменная, поэтому все, что ему назначено последним, будет использовано для всех значений.Попробуйте изменить свой код в файле ts, например:

public urlCursor: string[] = []
...
ngOnChanges(changes: any) {
    ...
    this.urlCursor = []; 
    this.urlCursor.push(
      this.checkUrl(changes.items.currentValue[0].redirectionViewUrl)
    );
    ...
}

и htlm, например:

<app-item
  *ngFor="let item of items; let ind=index"
   class="item-element"
   [ngStyle]="{'cursor': urlCursor[ind]}"
   [dataMode]="item.dataMode"
   [redirectionViewUrl]="item.redirectionViewUrl"
></app-item>
...