Type 'number' is not assignable to type '(...items: any[]) => number'

Question

I am doing an online course in Angular i know nothing about programming I can't find a solution to my problem what is wrong and where should i even look for my mistake I am using no strict mode

My html code:

<button
  class="btn btn-primary"
  (click)="onToggleDetails()">Display details</button>
<p *ngIf="showSecret">Secret password = tuna</p>
<div *ngFor="let logAmount of log">{{ logItem }}</div>

My ts code:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  showSecret = false;
  log = [];

  onToggleDetails() {
    this.showSecret = !this.showSecret;
    this.log.push = (this.log.length + 1)
  }
}

Any help and explanation would be appreciated !

Answer 1

Will try to make this answer as simple as possible. The problem is the way you are using the array's push function incorrectly. Below code of your's

onToggleDetails() {
    this.showSecret = !this.showSecret;
    this.log.push = (this.log.length + 1)
  }

Is trying to assign a number to the function push which is not allowed, hence the error.

Try the below code instead it will solve this error. .push is a function that takes a parameter(s) when called. Below is how you call it.

onToggleDetails() {
    this.showSecret = !this.showSecret;
    this.log.push(this.log.length + 1);
  }

To read more refer this array.push

Answer 2

.htmlFile

<button class="btn btn-primary" (click)="onToggleDetails()">
  Display details
</button>
<p *ngIf="showSecret">Secret password = tuna</p>
<div *ngFor="let logAmount of log">{{ logAmount }}</div>

.tsFile

showSecret = false;
  log = [];

  onToggleDetails() {
    this.showSecret = !this.showSecret;
    let data = this.log.length + 1;
    this.log.push(data);
  }