Native script integration with Angular 1


#1

Hi,

I am just starting with Nativescript and exploring the options to integrate with Angular1. I could see the documentation that Nativescript works pretty well with Angular 2 but I have few modules which is in Angular 1.5 and we are exploring the options to reuse our code for making it available for cross platform devices.

In summary - I have module running in Angular 1 and it’s a webbased SPA. We are trying to make this application available for Android and Ios by using NativeScript. I am just trying to see how much code can be reused.

Can anybody please share their thought on this?

Thanks,
Debasis


#3

Hi,

Thanks for your response. So is it like I can’t use NativeScript for my existing Angular 1 module? or do I need to rewrite completely? NativeScript also supports JavaScript, so is there any possible approach by which I can reuse my Angular 1 code ?

Thanks,
Debasis


#4

None that I’m aware of. It should be relatively straight forward to rewrite your services for NG2, but your UI and associated logic is going to be a complete rewrite.


#5

only option is to rewrite for ng2 compatible code as ng1 has dependencies on browser apis and thats problem as nativemobile apps dont know anything about html/browsers inside of their normal views for apps, not sure what was written in reply set as solution


#6

The last resort I would use is to put your old angular1 stuff inside a webview in the NS app and slowly rewrite it to use Nativescript views so you aren’t stuffing a webview in a native app :slight_smile:


#7

Thanks a lot Brad. NativeScript documentation says code can be reused between Angular 2 and Native script. I have one scenario as below

  1. My Angular 2 app is running in WebContatiner. (Ex - Tomcat). Now I want to reuse my Angular 2 code in Mobile.
    Can I have the same code base?
    Can the same code run in a single container? Can I run Native Script code in a WebContainer?
    I mean keeping same code in a same container, is it possible?

IF NOT
Then Am I having the duplicate code base for web and mobile? One code base will be running in web container and other code base will be running in mobile apps? So My Angular 2 services code will be having duplicate copy in web container and mobile as well?

Please excuse me for all basic doubt. Any insight to it will be much appreciated. Thanks a lot in advance.


#8

Okay so if you’re using Angular 2 then a lot of your code can be reused if you’ve taken an approach that allows you to do so.

Your view code for the web app you have can not be reused in nativescript because nativescript doesn’t have the DOM (no document model). The exception being that NativeScript does have a <WebView> component that you could drop your HTML from the web app into and it will render the HTML because it would be inside a webview.

You can run the same code base if you split things out with the understanding that not all web apis are in native apps for android/iOS.

Have a look at this seed project (https://github.com/NathanWalker/angular-seed-advanced) which runs one code base for a nativescript app, web app, and has an electron app also if you wanted. It might give you some help on how you could approach sharing your code base across native app and web app.


#9

Hi Brad,

Thanks a lot for your response. Need your help please in understanding few more doubts.

  1. When are you saying, we can share the same code base, is it same as running the Angular 2(webapp code) and Native App code in same webcontainer?
  2. Can I run Angular 2 and NativeScript code in WebContainer?
  3. I mean, I will have different components code for Web and different components code for NativeScript and same service code but everything will run in a webcontainer.
  4. We are trying to run Web app and Native script code in a webcontainer not writing a mobile app.

Let me describe the scenario

  1. We already have a Mobile app developed in Objective C
  2. We are developing web application in Angular 2.

I am leveraging NativeScript to understand the following feasibility

  1. I will use NativeScript to give Native look and feel of our Angular 2 webapp.
  2. Native Script will run in same web container along with Angular 2.
  3. Mobile app (Which is in objective C) will refer to NativeScript code(Which will run in webcontainer) and render the Native look and feel.

Is it feasible? Becasue NativeScript says it doesn’t understand DOM and it’s UI is in XML. Then how can I run it in a webcontainer?

Does NativeScript is only for Mobile Apps?

Thanks,
Debasis