Angular 8 error. 'show' does not exist on type

I am new to angular 8,
I googled the error for ages and cant seem to find whats wrong.

Thanks.

<button (click)="show = !show">{{show ? 'Hide' : 'Add a car'}}</button>

<div *ngIf="show">
    <form>
        <label>Make</label>
        <input type="text" name="make" placeholder="Enter Make" #make>

        <label>Model</label>
        <input type="text" name="model" placeholder="Enter Model" #model>

        <label>Year</label>
        <input type="text" name="year" placeholder="Enter Year" #year>

        <button type="submit" (click)="addTheCar(make.value,
             model.value,year.value)">Add the Car</button>
    </form>

</div>

<div class="container">
    <app-car *ngFor="let carData of carsData" [carData]="carData"></app-car>
</div>

This is the carlist.component.html(where the error sends me)

import { Component, OnInit } from '@angular/core';
import { ICar, Car } from '../interfaces/car';
import { CarApiService } from '../services/car-api.service';



@Component({
  selector: 'app-carlist',
  templateUrl: './carlist.component.html',
  styleUrls: ['./carlist.component.css'],
  providers: [CarApiService]
})
export class CarlistComponent implements OnInit {
  carsData: ICar[];

  constructor(private _carAPIService:CarApiService) { }


  ngOnInit(): void{
    this._carAPIService.getCarData().subscribe(carsData =>
      {this.carsData = carsData});
  }

  addTheCar(make:string, model:string, year:string):boolean{
    let tempCar:ICar;
    tempCar= new Car(make,model,year);
    this._carAPIService.addCarData(tempCar);
    return false;
  }

}

and where in your component do you put a holder for ‘show’? You’ve put one for carsData, and a few functions, but you havent defined something to hold the value for “show”.

1 Like

Thank you for helping got it working.

export class CarlistComponent implements OnInit {
  carsData: ICar[];
 show:boolean;
1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.