CODEWITHSUNDEEP
javascriptangular
ABC
ABC

Reputation: 832

How fixed the 404 (Not Found) in angular

I got an error 404 which it didn't found the http://localhost:4200/assets/icons/weather/.svg

which in my html

list.component.html

 <img src="./assets/icons/weather/{{ weatherClass?.img }}.svg" width="130px" />

weather.services

export class Weather {
    constructor(
        public locName: string,
        public temp: string,
        public img: string,
        public type:string,
        public tempMin:string,
        public tempMax:string,
        public countryName: string,
        public sunrise: string,
        public sunset: string) {}
}

list.componen.ts

this.weatherService.currentLocation(this.lat, this.lon).subscribe(data => {

        let sunset = format(new Date(data.sys.sunset * 1000), 'hh:mm a');
        this.weatherClass = new Weather(
          data.name,
          data.main.temp,
          data.weather[0].icon,
          data.weather[0].description,
          data.main.temp_max,
          data.main.temp_min,
          data.sys.country
        );
        return this.weatherClass;
      });

Upvotes: 0

Views: 469

Answers (1)

Suren Srapyan
Suren Srapyan

Reputation: 68635

You can't return this.weatherClass from the observable. Instead of it, you can show the image after it was initialized.

<img *ngIf="weatherClass" src="{{ './assets/icons/weather/' + weatherClass.img + '.svg' }}" width="130px" />

Upvotes: 2

Related Questions