共享 Angular 2 个应用程序，web/mobile-web/Ionic 2 个

Question

我似乎找不到在所有平台上使用相同 angular 2 代码的答案，例如 Angular 2 在他们的网站上推送。如果我有一个现有的网站（只有 node.js 服务器和 Angular 2 的骨架），我怎样才能合并 ionic 2 而不必保留单独的 ionic 应用程序？或者反之亦然（我需要成为网络应用程序的离子应用程序）？

有多种答案，例如复制 ionic 应用程序的 www 文件夹，但我认为这不是最佳实践答案，因为您无法 100% 重用该代码。用大量相同的代码维护两个完全独立的代码库似乎与跨平台的论点背道而驰。

Answer 1

It seems to go against the argument of cross-platform to maintain two completely separate code bases with a lot of identical code.

您可以使用 完全相同的代码 ，并使用 platform information:

决定布局的显示方式

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.

使用底层 platform 信息，您可以通过简单地执行以下操作来显示或隐藏它是 core 平台（网络应用程序）还是非平台（移动应用程序）：

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

然后使用 *ngIf 或您在应用程序中需要的任何内容。

关于样式：

Ionic2 uses modes to customize the look of components. Each platform has a default mode, but this can be overridden.

同样，您可以根据显示应用的设备控制应用的样式。就像您可以阅读 here，在您的 body 元素中将添加一个 class（core 如果它是一个网络应用程序，或者 ios/ android / windows 如果是移动应用）。因此您可以为每个平台创建自定义样式，它们将自动应用。

所以我认为您可以（并且应该）使用相同的代码来创建移动应用程序和 Web 应用程序，甚至可以使该应用程序在其他设备上正常工作像平板电脑或平板手机。

共享 Angular 2 个应用程序，web/mobile-web/Ionic 2 个

Shared Angular 2 application, web/mobile-web/Ionic 2

javascript

cross-platform

web-applications

ionic2

angular