如何修复预测循环推送

时间:2019-10-16 05:43:06

标签: javascript angular

单击nz-switch/switch button时如何解决循环问题。 我要创建一个开关。谢谢

代码如下:

child.component.ts

@Input() toggleUnit: boolean = false;

 ngOnChanges() {
    switch(this.toggleUnit) {
      case true: {
        this.unit = 'imperial';
        this.setWeatherForecast(this.unit)
        break;
      }case false: {
        this.unit = 'metric';
        this.setWeatherForecast(this.unit)
        break;
      }
    }
  }

  setWeatherForecast(unit: any) {
    this.weatherService.getLocation().subscribe(data => {
      this.lat = JSON.parse(data['_body']).latitude;
      this.lon = JSON.parse(data['_body']).longitude;

      this.weatherService
        .fiveDayForecast(this.lat, this.lon, unit)
        .subscribe(data => {
          for (let i = 0; i < data.list.length; i = i + 8) {
            const forecastWeather = new Forecast(
              data.city.name,
              data.list[i].weather[0].description,
              data.list[i].main.temp,
              data.list[i].dt_txt,
              data.list[i].weather[0].icon
            );
            this.forecast.push(forecastWeather);
          }

          return this.forecast;
        });
    });
  }

parent.component.ts

toggleUnit: boolean = false;
onSwitchChange() {
let temperature: any = [];

switch (this.toggleUnit) {
  case true: {
    this.toggleUnit = true;
    break;
  }
  case false: {

      temperature = document.getElementById(`temperature-${i}`) as HTMLCanvasElement;
      temperature.style.height =((this.tempThermometer[i].temperature - this.config.minTemp) / (this.config.maxTemp - this.config.minTemp)) * 100 + '%';
      temperature.dataset.value = this.tempThermometer[i].temperature + this.units['Celcius'];
    }
    this.toggleUnit = false;
    break;
  }

  }

**** parent.component.html ***

<app-forecast [toggleUnit]="toggleUnit"></app-forecast>

但是当我尝试登录时,它会更新并推送新行。 我使用nz-swith等。 输出将推送另一个新数组,切换时将添加另一个新数组。

0 个答案:

没有答案