Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

Node.js für ASP.NET-Entwickler

Models unter Node.js

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Hier soll der Zugriff auf Modelle in der MVC-Struktur näher betrachtet werden. Sie lernen, wie Sie Modelldateien strukturiert auslagern, im Controller konsumieren und über Vash anzeigen lassen können.

Transkript

In diesem Video schauen uns an, wie wir den Zugriff auf Modelle vornehmen in unserer MVC-Struktur, und zwar ist ein Modell entspricht ja nichts anderes wie pure Daten oder das es Module sind, die die Geschäftslogik der Anwendung beinhalten. Und diese Modellobjekte sollen eben explizit eben von dem jeweiligen Controller aufgerufen werden können und diese speichern und rufen häufig ja auch Daten aus der Datenbank ab. Wichtig ist aber, wenn man eben irgendwo dann mit einer Datenbank kommuniziert, sollte das Ganze bitte asynchron erfolgen. Als Beispiel für eine Struktur wie man das Ganze auslagern kann, ist, dass wir ein neues Verzeichnis von Data erzeugen und hier gibt es dann zum Beispiel dann Sample Data, wo ein json-Objekt hinterlegt ist mit ein paar Beispieldaten. Dann haben wir zum Beispiel das Repository, das den eigentlichen Webservice-Aufruf vornimmt et cetera. Dieses Datenmodul können wir natürlich wieder ganz einfach mittels CommonJS "require data" einfügen innerhalb von unserem Controller, und dann zum Beispiel auch diese asynchrone Funktion aufrufen. Das heißt, die Funktion und dann deren Callback, also das ist eigentlich immer sehr wichtig. Und innerhalb von diesem Callback ruft man die Render-Funktion auf und kann dann eben entsprechend das Produkt durchreichen, also das json-Objekt. Und ich habe zum Beispiel Vash geladen und dann schauen wir uns doch einfach mal an einem Beispiel an, wie zum Beispiel Vash das Ganze dann auch automatisch auf der Oberfläche anzeigen lassen kann mit einer forEach-Schleife. Schauen wir uns das einfach mit einem Beispiel direkt selber an. Und zwar erzeugen wir hier auch wieder ein Verzeichnis für unsere Daten "New folder" und zwar "data" Und hier erzeuge ich die index.ts-File und zwar baue ich jetzt nicht eine eigene json-Datei, die wir rein laden, ich werde das jetzt hier direkt in dieser Funktion vornehmen. "function" und das nennen wir einfach mal "loadProducts". Und da brauchen wir natürlich eine Callback-Next-Funktion. Wichtig ist natürlich, das Ganze hier als Modul zu exportieren. Und dann wird auch schon die next-Funktion aufgerufen. Wichtig ist natürlich, dass man sich bei den Callback an einer gewissen Syntax hält, das heißt, an erster Stelle gibt man immer mit, ob es einen Fehler gab oder nicht. In dem Fall gab es kein Fehler, also geben wir den Wert "null" durch, und dann können wir hier auch schon direkt unser json duchgeben, das dann zum Beispiel mehrere Einträge beinhaltet, das heißt, ich gebe das als error-Wert mit, und zwar haben wir hier das Property Wertname mit Windows Phone, markiere ich hier die Zahlen und mit ALT+Shift+Pfeiltaste nach unten dupliziere ich das Ganze, eigentlich wollte ich das dann nicht, das ersetzen wir durch ein Komma, und dann machen wir jedoch zum Beispiel noch einmal "xbox one" daraus. Dann haben wir zwei Produkte Genau! Also unsere Callback-Funktion wurde aufgerufen, und dann kommt unser json-Objekt mit. ALT+Shift+f, wird das Ganze nochmal formatiert Strg+s, speichern, dann speichern wir eben unser Daten Repository Modul. Und nun können wir innerhalb von unserem Controller darauf zugreifen. Und zwar machen wir das von ganz oben aus "import data =require data". Und er wird es nicht finden, weil wir uns in einem Verzeichnis controllers befinden. Er schaut jetzt natürlich bei den controllers in Root-Verzeichnis. Wir müssten also sozusagen eine Ebene höher, und das reicht es aus, wenn wir einfach dann zwei Punkte mitgeben. Und schon können wir innerhalb von unserer Controller-Funktion die data-Funktion aufrufen, und dann sehen wir auch die "loadProducts function", der wir eben unsere Funktion mitgeben mit "error" oder "products". Und genau! Das bedeutet den Part, den müssen wir nach oben schieben, dazu halte ich die ALT-Taste gedrückt, und die Pfeiltasten nach oben, ALT+Shift+f formatieren wir das Ganze auch noch und dann wollen wir ja nicht den Titel direkt mitgeben, sondern etwas mehr, und zwar haben wir jetzt auch noch mal "error property". Und dann haben wir unsere "products". Genau! Und so können wir jetzt die Daten automatisch Vash mit durchgeben. Und das entspricht hier mit dieser callback-Funktion, einem asynchrionen Aufruf. Strg+s, speichere ich das Ganze. Und der letzte Schritt ist nur noch, dass wir in unsere Vash-Datei gehen, wo wir dann das Ganze eben schön anzeigen lassen möchten. Und zwar den Titel belassen wir hier. Können wir erstmal abfragen, ob es einen Fehlerfall gab. "if model error". Wenn ja, wenn es einen Fehler gab, dann zeige ihn bitte an. Und zwar mit einem p-Tag. "Fehler:@model.error" Ansonsten möchten wir eine Liste von unseren Produkten. Also, "ul" und innerhalb des ul-Elements geben wir dann die einzelnen Listeneinträge mit, und zwar auch wieder durch "model.products.forEach function product". Und dann schreiben wir doch hier einfach den Listeneintrag. Und da wollen wir natürlich jedes Mal von unserem Produkt den Namen. Das war's auch schon! Dann können wir das Ganze einmal testen. Mit der f5-Taste starten wir die Anwendung. Ich aktualisiere meinen Chrome Browser. Und zack, bekommen wir eben auf unserer Startseite die Produkte alle nacheinander schön angezeigt. In dem Video haben wir gesehen, wie wir model-Dateien strukturiert auslagern und im Controller konsumieren und mittels Vash auf der Oberfläche anzeigen lassen.

Node.js für ASP.NET-Entwickler

Sehen Sie, wie Sie den Umstieg auf auf native JavaScript-Entiwcklung mit Node.js erfolgreich meistern.

2 Std. 52 min (31 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Exklusiv für Abo-Kunden
Erscheinungsdatum:15.05.2017

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!