Shared Angular 2-Anwendung, Web/Mobile-Web/Ionic 2

Question

Ich kann keine Antwort auf die Verwendung der gleichen eckigen 2-Code über alle Plattformen wie Angular 2 scheint auf ihrer Website drücken finden. Wenn ich eine existierende Website habe (blank bones nur node.js server und Angular 2), wie kann ich über die Integration von ionic 2 hinausgehen, ohne eine separate ionische Anwendung zu haben? Oder umgekehrt (ionische Anwendung, die ich eine Web-App sein muss)?

Da gibt es verschiedene Antworten wie Kopieren des www-Ordners der ionischen App, aber ich finde das nicht als eine Best-Practice-Antwort, weil Sie 100% dieses Codes nicht wiederverwenden können. Es scheint gegen das plattformübergreifende Argument zu gehen, zwei völlig getrennte Codebasen mit viel identischem Code zu pflegen.

Answer 1

Es scheint gegen das Argument der Cross-Plattform zu zwei völlig separaten Code-Basen mit viel identischem Code zu gehen.

Sie könnten benutzen, um genau den gleichen Code, und entscheiden, wie das Layout unter Verwendung der platform information gezeigt werden wird:

Platform Name Description 
android on a device running Android. 
cordova on a device running Cordova. 
core on a desktop device. 
ios on a device running iOS. 
ipad on an iPad device. 
iphone on an iPhone device. 
mobile on a mobile device. 
mobileweb in a browser on a mobile device. 
phablet on a phablet device. 
tablet on a tablet device. 
windows on a device running Windows. 

Mit den zugrunde liegenden platform Informationen könnten Sie Dinge zeigen oder verbergen, wenn its a core Plattform (Web App) oder nicht (mobile app) von nur einfach tun:

this.isWebapp = this.platform.is('core'); 

und dann durch mit *ngIf oder was auch immer Sie in Ihrer Anwendung brauchen.

In Bezug auf die Stile:

Ionic2 verwendet Modi das Aussehen der Komponenten anzupassen. Jede Plattform hat einen Standardmodus, der jedoch außer Kraft gesetzt werden kann.

So haben Sie wiederum die Kontrolle darüber, wie Ihre App gemäß dem Gerät, auf dem sie angezeigt wird, gestaltet wird. Wie Sie lesen können here, in Ihrem body Element wird eine Klasse hinzugefügt (core wenn es eine Web-App ist, oder ios/android/windows wenn es eine mobile App ist). So können Sie für jede Plattform benutzerdefinierte Stile erstellen, die automatisch angewendet werden.

Also ich denke, Sie könnten (und sollte) den gleichen Code für die Erstellung sowohl eine Mobile und eine Web-App verwenden, und sogar diese App in anderen Geräten wie Tabletten oder Phablets gut funktionieren.