Wie das laden der Daten asynchron mit AngularJS mit SpringMVC?

Habe ich neu AngularJS und wunderst über die beste Herangehensweise an die folgende situation:

1. Ich muss die Zeilen von Daten für die letzten 30 Tage. (Standard-option)

Wie mache ich es:, Wenn die Seite geladen wird, wird die Feder controller stellt die Liste in der Modell-Attribut.

@RequestMapping(value="/show/data", method = RequestMethod.GET)
    public String getDataPage(ModelMap model) {
        //cropped for brevity
        List<Data> dataList = dataService.getData(fromDate, toDate);
        model.addAttribute("dataList ", dataList );

        return "data-page";
    }

Und in die JSP-ich bin mit EL-tags, um eine Schleife durch die Liste und Karte Benutzer die Daten in tabellarischer form

<c:forEach var="currentData" items="${dataList}">
    <tr>
        <td>${currentData.name}</td>
        <td>${currentData.address}</td>
        <td>${currentData.email}</td>
        <td>${currentData.phone}</td>
    </tr>
</c:forEach>
  1. Hat der Benutzer eine option zum auswählen des Datumsbereichs & abhängig von dem ausgewählten Bereich(z.B. heute, gestern, Letzte Woche, letzter Monat, Benutzerdefiniert (mittelkampf), die angezeigten Daten aktualisiert werden.

Wie mache ich es: ich bin mit Bootstrap-Daterangepicker ( https://github.com/dangrossman/bootstrap-daterangepicker ), um zu zeigen, das markup. Es bietet mir eine callback-Funktion.

$('#reportrange').daterangepicker(options, callback);

z.B. $('#reportrange').daterangepicker(options, function(startDate, endDate){});

Ohne AngularJS, das wird zu chaotisch.
Ich kann aufrufen, jQuery, ajax und dann Holen Sie sich eine Liste, dann Durcheinander herum mit der DOM-Elemente innerhalb von jQuery. Aber das ist chaotisch.

Wie kann ich AngularJS in diesem Szenario mein Leben erleichtern. (und der code viel weniger Reiniger)
Bitte helfen Sie. Ich bin stecken.

Schreibe einen Kommentar