Question

我在应用程序中获得了数组结构，然后按如下所示将其分配给变量：

     `
    .subscribe(data => (
        this.user = data,
        console.log('rain', this.user)
    ));`

但是我无法以HTML显示它。我尝试以以下方式显示

` <ion-option  *ngFor="let users of user">{{users[0].pentad1.
 rainfall}}</ion-option>
               </ion-select> `

有人可以帮我吗？

Answer 1

您需要使用* ngFor而不是For才能将其显示为HTML

Answer 2

在api文件中使用promise，

 get_pentad1(param){
    return new Promise( resolve => {
      this.http.method(url, param)
        .subscribe(
          data => {
            resolve(data);
          },
          error => {
            resolve(error.statusText);
          }
        );
    });
  }

使用.then()函数从api获取响应

this.api.get_pentad1(param).then(data => { this.user = data[0] } );

Answer 3

尝试以下代码：

TS文件：

# Importing the libraries
import numpy as np
import matplotlib.pyplot as plt
import pandas as pd
import operator

# Importing the dataset
dataset = pd.read_csv('1992_2014.csv', index_col =0)

nations_all = dataset.iloc[:, 0].values
nations = [nations_all[0]]
for i in range(0, len(nations_all)):
    if nations_all[i] not in nations:
        nations.append(nations_all[i])

Year = dataset.iloc[:, 1].values
CO2 = dataset.iloc[:, 8].values



# Creating the Trend Matrix between two nations
trend_matrix = pd.DataFrame(index = nations, columns = nations)
for i in nations:
    n = dataset[dataset["Nation"] == i].index.values.astype(int)
    for k in nations:
        kn = dataset[dataset["Nation"] == k].index.values.astype(int)
        div_n = CO2[n[0]]
        div_kn = CO2[kn[0]]
        CO2_n = (CO2[n]/div_n)
        CO2_kn = (CO2[kn]/div_kn)

        trend_matrix.loc[i, k] =   sum(list(map(abs,list(map(operator.sub, CO2_n, CO2_kn)))))

HTML：

public user : any = [];


.subscribe((data)=>{
      this.user = data;
  });

您可能需要更改“ pentad1”和“ pentad2”，以便与建议保持一致

Answer 4

从数组结构中显示降雨，我建议您使用管道。

运行以下命令以生成管道

 ionic generate pipe rainfall

What is a pipe?

在您的组件中

...
public users : any = [];
...
.subscribe(res => {
    this.users = res;
 });

管道中的转换功能

transform(value: string, index: number) {
    const key = `pentad${index+1}`;
    return value[key].rainfall;
}

在您的html

<ion-select>
    <ion-option *ngFor="let user of users; let i = index;" [value]="user">{{user | rainfall: i}}</ion-option>
</ion-select>

注意：将 PipesModule 放入组件模块的 imports 数组中。

无法在Angular 4 Ionic 3中的html中显示数组对象

4 个答案: