Question

我正在使用ng2-dnd包，简单的html5包对列表进行拖放以对其进行排序。

我只能弄清楚如何从数组中填充列表，我需要它来自JSON。

这是我的代码：

import { Component } from '@angular/core';

import { DND_DIRECTIVES } from 'ng2-dnd/ng2-dnd';

import { Report } from "./Report";

@Component({
    selector: 'my-app',
    styleUrls: ['style.css'],
    directives: [DND_DIRECTIVES],
    template: `
    <h1 align="center">{{title}}</h1>
    <h2>list of reports:</h2>
    <div dnd-sortable-container [sortableData]="reports">
    <div *ngFor="let rep of reports; let i=index" dnd-sortable [sortableIndex]="i">
    ID:{{rep.id}} <p></p> Name:{{rep.name}}
    </div>
    <div>{{reports | json}}</div>
    `
})

export class AppComponent {

    title = 'Reorder List';

    reports = [
        new Report(1, 'Italy'),
        new Report(2, 'Spain'),
        new Report(3, 'Italy'),
        new Report(4, 'Spain'),
        new Report(5, 'Netherlands'),
        new Report(6, 'Italy')
    ];
}

如果有人知道如何使用它从报告的JSON中获取数据而不是一系列报告，那将真正帮助我：）

谢谢！

Answer 1

假设您返回的数据是一个JSON数组，您可以使用map函数返回一个Report这样的数组：

var data = [{id: 1 , name:"Italy"}, {id: 2 , name:"Viet Nam"}];
var reports =     data.map(x=> new Report(x.id, x.name));

如何使用ng2-dnd包从json而不是数组中读取数据？

1 个答案: