Question

我每10秒从套接字io这个JSON中获取数据。

data { "nr": "1" }
data { "nr": "2" }
.
.
.
.
data { "nr": "5555" }

我在ts中具有此功能：

....
mydata:any;

constructor(private zone:NgZone) {
  super()
}

....
socketIO.on('hello', (data) => { 
  this.zone.run(()=> {
    console.log('data', data);
    this.mydata= data;
  }); 
});

在HTML Nativescript中：

<StackLayout>
  <Label text={{mydata}}></Label><br/>
</StackLayout>

现在，问题在视图中，我想在视图中打印所有数据1、2、3、4，...，5555

不仅是5555点的终点

有什么想法请打印所有数据吗？

Answer 1

您必须将mydata转换为数组。

HTML

<StackLayout >
        <!-- json pipe just neatly outputs the data -->
        <Label text={{ mydata | json }}></Label>
       <!-- Or to list items one by one --->
       <Label *ngFor="let label of mydata; let i = index" text={{ label.nr }}> 
       </Label>
</StackLayout>

TS ....

mydata:any = [];

constructor(private zone:NgZone) {
    super()
}

    ....
    socketIO.on('hello', (data) => { 
        this.zone.run(()=> {
           console.log('data', data);
           this.mydata.push(data);
        }); 
    });

注意：<br>标记在{N}环境中无效

来自套接字io的数据未在视图中全部显示

1 个答案: