NgClass zwraca zawsze false:

0

Cześć Mam takie pytanie dlaczego NgClass tutaj zawsze zwraca jakby false dodaje tylko tą drugą klasę kiedy sprawdzam console.log() i wartość jest true :(

        <span *ngIf="startPage > 1">
            <li [ngClass]="(page===currentPage)?'deactive': 'active'">1</li>
        </span>
  ngOnInit() {
    const page =  parseInt(this.route.snapshot.paramMap.get('page'));
    this.http.get(`https://localhost:44333/Tenure/GetAll/${page}`).subscribe((x:any)=> {
      this.data = x.payload;
      this.totalPages = x.totalPages;
      this.startPage = x.startPage;
      this.endPage = x.endPage;
      this.currentPage = x.currentPage;

      console.log(x);
      console.log(this.totalPages);
      console.log(this.endPage);
      console.log(this.startPage);
      console.log(page);
      console.log(this.currentPage);
      console.log(page===this.currentPage);

1

Czym jest zmienna page w widoku?
Gdzie jest zapisana w komponencie?

0

Kurcze miałem bląd logiczny powinno być nie page a 1

<li [ngClass]="(currentPage==1)?'deactive': 'active'">1</li>

ale i tak nie działa :(

a tak wygląda ts

import { Component, OnInit } from '@angular/core';
import { TenureService } from '../tenure-dialog/tenure.service';
import { HttpClient } from '@angular/common/http';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-tenure-list',
  templateUrl: './tenure-list.component.html',
  styleUrls: ['./tenure-list.component.scss']
})
export class TenureListComponent implements OnInit {

  constructor(private service: TenureService, private http: HttpClient, private route: ActivatedRoute) { }
  data: any;
  totalPages: number;
  startPage: number;
  endPage: number;
  input = [];
  currentPage: number;
  pageNumber: number;

  ngOnInit() {

    const page =  this.route.snapshot.paramMap.get('page');
    this.http.get(`https://localhost:44333/Tenure/GetAll/${page}`).subscribe((x:any)=> {
      this.data = x.payload;
      this.totalPages = x.totalPages;
      this.startPage = x.startPage;
      this.endPage = x.endPage;
      this.currentPage = x.currentPage;

      console.log(this.currentPage===1);
      

      for(var i = this.startPage; i<=this.endPage; i++) {
        this.input.push(i);
      }

      console.log(this.input);
    });

    return this.data;
  }
}
1

Może spróbuj przerobić warunek w [ngClass] na taki, jak w dokumentacji? https://angular.io/api/common/NgClass

Czyli coś na zasadzie [ngClass]="{'deactive': currentPage===1, 'active': currentPage!==1}

Na marginesie, to "inactive", a nie "deactive" ;)

1 użytkowników online, w tym zalogowanych: 0, gości: 1