{"id":2490,"date":"2017-01-11T15:00:00","date_gmt":"2017-01-11T15:00:00","guid":{"rendered":"https:\/\/www.couchbase.com\/blog\/?p=2490"},"modified":"2025-06-13T20:15:27","modified_gmt":"2025-06-14T03:15:27","slug":"syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular","status":"publish","type":"post","link":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/","title":{"rendered":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular"},"content":{"rendered":"<p>Over the past few days we&#8217;ve been exploring how to create a simple Android and iOS application using NativeScript, Angular and Couchbase. First we saw how to <a href=\"https:\/\/www.couchbase.com\/blog\/key-value-operations-in-couchbase-mobile-via-nativescript-and-angular\/\">use Couchbase for basic key-value operations<\/a> and then we saw <a href=\"https:\/\/www.couchbase.com\/blog\/querying-for-couchbase-documents-in-a-nativescript-angular-mobile-application\/\">how to query Couchbase as a document database<\/a>. The final chapter is to add replication support to our NativeScript application using Couchbase Sync Gateway.<\/p>\n<p>We&#8217;re going to expand upon the previous two examples to synchronize data between platforms and devices using Couchbase Sync Gateway, NativeScript, and Angular. Take the following animated image for example:<\/p>\n<div class=\"figure\"><img decoding=\"async\" src=\"\/wp-content\/original-assets\/2017\/january\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/ns-cb-profile-sync.gif\" alt=\"Couchbase Sync with NativeScript and Angular\" \/><\/div>\n<p>When a new profile is added to the iOS device it is synchronized to the Android device and likewise in the opposite direction. This is possible through very little code.<\/p>\n<h2 id=\"the-requirements\">The Requirements<\/h2>\n<p>The requirements between this example and the previous two have changed a bit. To be successful you&#8217;ll need the following:<\/p>\n<ul>\n<li><a href=\"https:\/\/www.nativescript.org\">NativeScript<\/a> 2.0+<\/li>\n<li>Couchbase Sync Gateway<\/li>\n<\/ul>\n<p>NativeScript, Angular, and the Couchbase Lite plugin can all be obtained through the NativeScript CLI. We won&#8217;t be synchronizing our data to Couchbase Server in this example, but we can easily do so with very little changes.<\/p>\n<h2 id=\"picking-up-where-we-left-off\">Picking Up Where We Left Off<\/h2>\n<p>To be successful with this tutorial you&#8217;ll need to have viewed <a href=\"https:\/\/www.couchbase.com\/blog\/querying-for-couchbase-documents-in-a-nativescript-angular-mobile-application\/\">part 2<\/a> which has its own dependency of having viewed <a href=\"https:\/\/www.couchbase.com\/blog\/key-value-operations-in-couchbase-mobile-via-nativescript-and-angular\/\">part 1<\/a>. Most of the code in those previous guides can be copied and pasted into a project.<\/p>\n<p>Before continuing, you should have a functional two page NativeScript application with a modal dialog. The data in this application is saved in <a href=\"https:\/\/www.couchbase.com\">Couchbase<\/a> and queried using MapReduce views.<\/p>\n<h2 id=\"creating-an-angular-service-for-couchbase\">Creating an Angular Service for Couchbase<\/h2>\n<p>Because data replication will be involved, we need to make sure we only have a single instance of Couchbase running in our application. In the previous example we created a new instance on a per page basis. We can&#8217;t do that with replication because we may end up replicating multiple times which is inefficient.<\/p>\n<p>To create a singleton instance of Couchbase, we should create an Angular service. Create a file within your project at <strong>app\/couchbase.service.ts<\/strong> and include the following TypeScript code:<\/p>\n<pre><code>import { Injectable } from \"@angular\/core\";\r\nimport { Couchbase } from \"nativescript-couchbase\";\r\n\r\n@Injectable()\r\nexport class CouchbaseService {\r\n\r\n    private database: any;\r\n    private pull: any;\r\n    private push: any;\r\n\r\n    public constructor() { }\r\n\r\n    public getDatabase() { }\r\n\r\n    public startSync(gateway: string, continuous: boolean) { }\r\n\r\n    public stopSync() { }\r\n\r\n}<\/code><\/pre>\n<p>This service will be injectable in every page. A single instance of Couchbase will be stored in the <code>database<\/code> variable and information about the push and pull replicators will be stored in their respectful variables.<\/p>\n<p>Within the <code>constructor<\/code> method we have the following:<\/p>\n<pre><code>public constructor() {\r\n    if(!this.database) {\r\n        this.database = new Couchbase(\"data\");\r\n        this.database.createView(\"profiles\", \"1\", function(document, emitter) {\r\n            emitter.emit(document._id, document);\r\n        });\r\n    }\r\n}<\/code><\/pre>\n<p>Before creating a new Couchbase instance we make sure we don&#8217;t already have one. If not, we open the database and create a MapReduce view, which is nothing we haven&#8217;t already seen in the previous examples.<\/p>\n<pre><code>public getDatabase() {\r\n    return this.database;\r\n}<\/code><\/pre>\n<p>When it comes time to obtaining this instance we can return it through the <code>getDatabase<\/code> function. This leads us to data replication.<\/p>\n<pre><code>public startSync(gateway: string, continuous: boolean) {\r\n    this.push = this.database.createPushReplication(gateway);\r\n    this.pull = this.database.createPullReplication(gateway);\r\n\r\n    this.push.setContinuous(continuous);\r\n    this.pull.setContinuous(continuous);\r\n\r\n    this.push.start();\r\n    this.pull.start();\r\n}<\/code><\/pre>\n<p>For this example we will do a two-way sync against a Sync Gateway instance. We have the option to sync one time or continuously for as long as the application is open. When we wish to stop replication we can make use of the <code>stopSync<\/code> function seen below:<\/p>\n<pre><code>public stopSync() {\r\n    this.push.stop();\r\n    this.pull.stop();\r\n}<\/code><\/pre>\n<p>Since this is going to be a shared service, it needs to be injected into the project&#8217;s <code>@NgModule<\/code> block. Open the project&#8217;s <strong>app\/app.module.ts<\/strong> file and include the following TypeScript:<\/p>\n<pre><code>import { NgModule, NO_ERRORS_SCHEMA } from \"@angular\/core\";\r\nimport { NativeScriptModule } from \"nativescript-angular\/platform\";\r\nimport { NativeScriptFormsModule } from \"nativescript-angular\/forms\";\r\nimport { NativeScriptRouterModule } from \"nativescript-angular\/router\";\r\nimport { ModalDialogService } from \"nativescript-angular\/modal-dialog\";\r\n\r\nimport { appComponents, appRoutes } from \".\/app.routing\";\r\nimport { AppComponent } from \".\/app.component\";\r\nimport { ModalComponent } from \".\/app.modal\";\r\nimport { CouchbaseService } from \".\/couchbase.service\";\r\n\r\n@NgModule({\r\n    declarations: [AppComponent, ModalComponent, ...appComponents],\r\n    entryComponents: [ModalComponent],\r\n    bootstrap: [AppComponent],\r\n    imports: [\r\n        NativeScriptModule,\r\n        NativeScriptFormsModule,\r\n        NativeScriptRouterModule,\r\n        NativeScriptRouterModule.forRoot(appRoutes)\r\n    ],\r\n    providers: [ModalDialogService, CouchbaseService],\r\n    schemas: [NO_ERRORS_SCHEMA]\r\n})\r\nexport class AppModule { }<\/code><\/pre>\n<p>The above is what we had seen previously, but this time we imported the <code>CouchbaseService<\/code> and injected it into the <code>providers<\/code> array of the <code>@NgModule<\/code> block.<\/p>\n<p>Now each of our pages can be upgraded to use the new Angular service.<\/p>\n<h2 id=\"upgrading-the-nativescript-application-pages\">Upgrading the NativeScript Application Pages<\/h2>\n<p>We have two pages that need to be updated to reflect our Angular service. Open the project&#8217;s <strong>app\/components\/profile-list\/profile-list.ts<\/strong> file and strip out the Couchbase code found in the <code>constructor<\/code> method. Instead or file should look like the following:<\/p>\n<pre><code>import { Component, OnInit, OnDestroy, NgZone } from \"@angular\/core\";\r\nimport { Location } from \"@angular\/common\";\r\nimport { Router } from \"@angular\/router\";\r\nimport { CouchbaseService } from \"..\/..\/couchbase.service\";\r\n\r\n@Component({\r\n    selector: \"profile-list\",\r\n    templateUrl: \".\/components\/profile-list\/profile-list.html\",\r\n})\r\nexport class ProfileListComponent implements OnInit, OnDestroy {\r\n\r\n    public profiles: Array;\r\n    private database: any;\r\n\r\n    public constructor(private router: Router, private location: Location, private zone: NgZone, private couchbase: CouchbaseService) {\r\n        this.database = this.couchbase.getDatabase();\r\n        this.profiles = [];\r\n    }\r\n\r\n    public ngOnInit() {\r\n        this.location.subscribe(() =&gt; {\r\n            this.refresh();\r\n        });\r\n        this.refresh();\r\n    }\r\n\r\n    public refresh() {\r\n        this.profiles = [];\r\n        let rows = this.database.executeQuery(\"profiles\");\r\n        for(let i = 0; i &lt; rows.length; i++) {\r\n            this.profiles.push(rows[i]);\r\n        }\r\n    }\r\n\r\n    public create() {\r\n        this.router.navigate([\"profile\"]);\r\n    }\r\n\r\n}<\/code><\/pre>\n<p>Notice in the above that we&#8217;ve imported <code>CouchbaseService<\/code> and injected it into the <code>constructor<\/code> method along with <code>NgZone<\/code>. Instead of getting the database and creating a view, we just need to call the <code>getDatabase<\/code> function of our service.<\/p>\n<p>Not too bad so far right?<\/p>\n<p>Now let&#8217;s open the project&#8217;s <strong>app\/components\/profile\/profile.ts<\/strong> file. In this file, include the following code:<\/p>\n<pre><code>import { Component, ViewContainerRef } from \"@angular\/core\";\r\nimport { Location } from \"@angular\/common\";\r\nimport { ModalDialogService } from \"nativescript-angular\/directives\/dialogs\";\r\nimport { CouchbaseService } from \"..\/..\/couchbase.service\";\r\nimport { ModalComponent } from \"..\/..\/app.modal\";\r\n\r\n@Component({\r\n    selector: \"profile\",\r\n    templateUrl: \".\/components\/profile\/profile.html\",\r\n})\r\nexport class ProfileComponent {\r\n\r\n    public profile: any;\r\n    private database: any;\r\n\r\n    public constructor(private modal: ModalDialogService, private vcRef: ViewContainerRef, private location: Location, private couchbase: CouchbaseService) {\r\n        this.profile = {\r\n            photo: \"~\/kitten1.jpg\",\r\n            firstname: \"\",\r\n            lastname: \"\"\r\n        }\r\n        this.database = this.couchbase.getDatabase();\r\n    }\r\n\r\n    public showModal(fullscreen: boolean) {\r\n        let options = {\r\n            context: { promptMsg: \"Pick your avatar!\" },\r\n            fullscreen: fullscreen,\r\n            viewContainerRef: this.vcRef\r\n        };\r\n        this.modal.showModal(ModalComponent, options).then((res: string) =&gt; {\r\n            this.profile.photo = res || \"~\/kitten1.jpg\";\r\n        });\r\n    }\r\n\r\n    public save() {\r\n        this.database.createDocument(this.profile);\r\n        this.location.back();\r\n    }\r\n\r\n}<\/code><\/pre>\n<p>With the exception of <code>NgZone<\/code>, we&#8217;ve made the same change to Couchbase as we did in the previous page. We&#8217;ll see what <code>NgZone<\/code> is all about soon.<\/p>\n<p>At this point we can proceed to configuring Sync Gateway in preparation of data synchronization.<\/p>\n<h2 id=\"building-the-sync-gateway-replication-configuration\">Building the Sync Gateway Replication Configuration<\/h2>\n<p>You should have already downloaded <a href=\"https:\/\/www.couchbase.com\/downloads\/\">Couchbase Sync Gateway<\/a> by now. With it installed we need to create a configuration file for our project. The following is an example of a very simple configuration:<\/p>\n<pre><code>{\r\n    \"log\":[\"CRUD+\", \"REST+\", \"Changes+\", \"Attach+\"],\r\n    \"databases\": {\r\n        \"example\": {\r\n            \"server\":\"walrus:\",\r\n            \"sync\":`\r\n                function (doc) {\r\n                    channel (doc.channels);\r\n                }\r\n            `,\r\n            \"users\": {\r\n                \"GUEST\": {\r\n                    \"disabled\": false,\r\n                    \"admin_channels\": [\"*\"]\r\n                }\r\n            }\r\n        }\r\n    }\r\n}<\/code><\/pre>\n<p>The above configuration can be saved to a file called <strong>sync-gateway-config.json<\/strong> or similar. Essentially it uses an in-memory storage called <code>walrus:<\/code> with a database name of <code>example<\/code>. There are no read or write permissions in our example. All data will be synchronized to all platforms and devices.<\/p>\n<p>Connecting the Sync Gateway to Couchbase Server is as simple as changing out <code>walrus:<\/code> to the host of your Couchbase Server instance.<\/p>\n<p>To run Sync Gateway from the command line you would execute:<\/p>\n<pre><code>\/path\/to\/sync_gateway \/path\/to\/sync-gateway-config.json<\/code><\/pre>\n<p>It will spin up a dashboard that can be accessed from https:\/\/localhost:4985\/_admin\/. From an application level it will use port 4984.<\/p>\n<h2 id=\"including-synchronization-logic-for-couchbase-and-nativescript\">Including Synchronization Logic for Couchbase and NativeScript<\/h2>\n<p>Everything is complete in preparation of data replication in our application. Data replication will allow us to use change listeners to update our UI as needed.<\/p>\n<p>Open the project&#8217;s <strong>app\/components\/profile-list\/profile-list.ts<\/strong> and include the following within the <code>ngOnInit<\/code> method:<\/p>\n<pre><code>public ngOnInit() {\r\n    this.location.subscribe(() =&gt; {\r\n        this.refresh();\r\n    });\r\n    this.couchbase.startSync(\"https:\/\/192.168.57.1:4984\/example\", true);\r\n    this.database.addDatabaseChangeListener((changes) =&gt; {\r\n        for (let i = 0; i &lt; changes.length; i++) { let document = this.database.getDocument(changes[i].getDocumentId()); this.zone.run(() =&gt; {\r\n                this.profiles.push(document);\r\n            });\r\n        }\r\n    });\r\n    this.refresh();\r\n}<\/code><\/pre>\n<p>When the <code>ngOnInit<\/code> triggers we start synchronization with our locally running Sync Gateway. Feel free to set the hostname to whatever is appropriate for you. After we start syncing, we set up our change listener to push changes into our <code>profiles<\/code> array. Since this is a listener, we need to use <code>NgZone<\/code> otherwise it won&#8217;t reflect in the UI.<\/p>\n<p>The above is only a simple example where we add all changes. In reality you&#8217;ll need to check if data has changed, was created, or was deleted. All scenarios would come through the <code>addDatabaseChangeListener<\/code>.<\/p>\n<p>When the application stops, we want to gracefully stop synchronization. In the <code>ngOnDestroy<\/code> method, include the following:<\/p>\n<pre><code>public ngOnDestroy() {\r\n    this.couchbase.stopSync();\r\n}<\/code><\/pre>\n<p>Replication to Couchbase Sync Gateway will stop when the above Angular method is called.<\/p>\n<h2 id=\"conclusion\">Conclusion<\/h2>\n<p>In this tutorial you saw how to add synchronization support to your NativeScript Angular mobile application. This was part three of three in the tutorial series. Previously we saw how to do <a href=\"https:\/\/www.couchbase.com\/blog\/key-value-operations-in-couchbase-mobile-via-nativescript-and-angular\/\">basic Couchbase operations to save and load data<\/a> as well as <a href=\"https:\/\/www.couchbase.com\/blog\/querying-for-couchbase-documents-in-a-nativescript-angular-mobile-application\/\">query for documents<\/a>. Data in mobile application development using frameworks like <a href=\"https:\/\/www.nativescript.org\">NativeScript<\/a> and Angular should come easy. Being able to store JavaScript objects and JSON data into a NoSQL database and have it sync is a huge burden lifted for the developer.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Over the past few days we&#8217;ve been exploring how to create a simple Android and iOS application using NativeScript, Angular and Couchbase. First we saw how to use Couchbase for basic key-value operations and then we saw how to query [&hellip;]<\/p>\n","protected":false},"author":63,"featured_media":13873,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[1815,1810,9327,2366],"tags":[1704,1543,1589,1562],"ppma_author":[9032],"class_list":["post-2490","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-best-practices-and-tutorials","category-couchbase-mobile","category-javascript","category-sync-gateway","tag-angular","tag-javascript","tag-nativescript","tag-replication"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.8 (Yoast SEO v25.8) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular - The Couchbase Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular\" \/>\n<meta property=\"og:description\" content=\"Over the past few days we&#8217;ve been exploring how to create a simple Android and iOS application using NativeScript, Angular and Couchbase. First we saw how to use Couchbase for basic key-value operations and then we saw how to query [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\" \/>\n<meta property=\"og:site_name\" content=\"The Couchbase Blog\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/thepolyglotdeveloper\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-11T15:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-06-14T03:15:27+00:00\" \/>\n<meta name=\"author\" content=\"Nic Raboy, Developer Advocate, Couchbase\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@nraboy\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nic Raboy, Developer Advocate, Couchbase\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\"},\"author\":{\"name\":\"Nic Raboy, Developer Advocate, Couchbase\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/bb545ebe83bb2d12f91095811d0a72e1\"},\"headline\":\"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular\",\"datePublished\":\"2017-01-11T15:00:00+00:00\",\"dateModified\":\"2025-06-14T03:15:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\"},\"wordCount\":1126,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png\",\"keywords\":[\"Angular\",\"javascript\",\"nativescript\",\"replication\"],\"articleSection\":[\"Best Practices and Tutorials\",\"Couchbase Mobile\",\"JavaScript\",\"Sync Gateway\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\",\"url\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\",\"name\":\"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular - The Couchbase Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png\",\"datePublished\":\"2017-01-11T15:00:00+00:00\",\"dateModified\":\"2025-06-14T03:15:27+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage\",\"url\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png\",\"contentUrl\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png\",\"width\":1800,\"height\":630},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.couchbase.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#website\",\"url\":\"https:\/\/www.couchbase.com\/blog\/\",\"name\":\"The Couchbase Blog\",\"description\":\"Couchbase, the NoSQL Database\",\"publisher\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.couchbase.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#organization\",\"name\":\"The Couchbase Blog\",\"url\":\"https:\/\/www.couchbase.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/2023\/04\/admin-logo.png\",\"contentUrl\":\"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/2023\/04\/admin-logo.png\",\"width\":218,\"height\":34,\"caption\":\"The Couchbase Blog\"},\"image\":{\"@id\":\"https:\/\/www.couchbase.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/bb545ebe83bb2d12f91095811d0a72e1\",\"name\":\"Nic Raboy, Developer Advocate, Couchbase\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/image\/8863514d8bed0cf6080f23db40e00354\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/bedeb68368d4681aca4c74fe5f697f0c423b80d498ec50fd915ba018b72c101f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/bedeb68368d4681aca4c74fe5f697f0c423b80d498ec50fd915ba018b72c101f?s=96&d=mm&r=g\",\"caption\":\"Nic Raboy, Developer Advocate, Couchbase\"},\"description\":\"Nic Raboy is an advocate of modern web and mobile development technologies. He has experience in Java, JavaScript, Golang and a variety of frameworks such as Angular, NativeScript, and Apache Cordova. Nic writes about his development experiences related to making web and mobile development easier to understand.\",\"sameAs\":[\"https:\/\/www.thepolyglotdeveloper.com\",\"https:\/\/www.facebook.com\/thepolyglotdeveloper\",\"https:\/\/x.com\/nraboy\"],\"url\":\"https:\/\/www.couchbase.com\/blog\/author\/nic-raboy-2\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular - The Couchbase Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/","og_locale":"en_US","og_type":"article","og_title":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular","og_description":"Over the past few days we&#8217;ve been exploring how to create a simple Android and iOS application using NativeScript, Angular and Couchbase. First we saw how to use Couchbase for basic key-value operations and then we saw how to query [&hellip;]","og_url":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/","og_site_name":"The Couchbase Blog","article_author":"https:\/\/www.facebook.com\/thepolyglotdeveloper","article_published_time":"2017-01-11T15:00:00+00:00","article_modified_time":"2025-06-14T03:15:27+00:00","author":"Nic Raboy, Developer Advocate, Couchbase","twitter_card":"summary_large_image","twitter_creator":"@nraboy","twitter_misc":{"Written by":"Nic Raboy, Developer Advocate, Couchbase","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#article","isPartOf":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/"},"author":{"name":"Nic Raboy, Developer Advocate, Couchbase","@id":"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/bb545ebe83bb2d12f91095811d0a72e1"},"headline":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular","datePublished":"2017-01-11T15:00:00+00:00","dateModified":"2025-06-14T03:15:27+00:00","mainEntityOfPage":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/"},"wordCount":1126,"commentCount":4,"publisher":{"@id":"https:\/\/www.couchbase.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage"},"thumbnailUrl":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png","keywords":["Angular","javascript","nativescript","replication"],"articleSection":["Best Practices and Tutorials","Couchbase Mobile","JavaScript","Sync Gateway"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/","url":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/","name":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular - The Couchbase Blog","isPartOf":{"@id":"https:\/\/www.couchbase.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage"},"image":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage"},"thumbnailUrl":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png","datePublished":"2017-01-11T15:00:00+00:00","dateModified":"2025-06-14T03:15:27+00:00","breadcrumb":{"@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#primaryimage","url":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png","contentUrl":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/sites\/1\/2022\/11\/couchbase-nosql-dbaas.png","width":1800,"height":630},{"@type":"BreadcrumbList","@id":"https:\/\/www.couchbase.com\/blog\/syncing-couchbase-documents-between-mobile-platforms-and-devices-with-nativescript-and-angular\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.couchbase.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Syncing Couchbase Documents Between Mobile Platforms and Devices with NativeScript and Angular"}]},{"@type":"WebSite","@id":"https:\/\/www.couchbase.com\/blog\/#website","url":"https:\/\/www.couchbase.com\/blog\/","name":"The Couchbase Blog","description":"Couchbase, the NoSQL Database","publisher":{"@id":"https:\/\/www.couchbase.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.couchbase.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.couchbase.com\/blog\/#organization","name":"The Couchbase Blog","url":"https:\/\/www.couchbase.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.couchbase.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/2023\/04\/admin-logo.png","contentUrl":"https:\/\/www.couchbase.com\/blog\/wp-content\/uploads\/2023\/04\/admin-logo.png","width":218,"height":34,"caption":"The Couchbase Blog"},"image":{"@id":"https:\/\/www.couchbase.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/bb545ebe83bb2d12f91095811d0a72e1","name":"Nic Raboy, Developer Advocate, Couchbase","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.couchbase.com\/blog\/#\/schema\/person\/image\/8863514d8bed0cf6080f23db40e00354","url":"https:\/\/secure.gravatar.com\/avatar\/bedeb68368d4681aca4c74fe5f697f0c423b80d498ec50fd915ba018b72c101f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/bedeb68368d4681aca4c74fe5f697f0c423b80d498ec50fd915ba018b72c101f?s=96&d=mm&r=g","caption":"Nic Raboy, Developer Advocate, Couchbase"},"description":"Nic Raboy is an advocate of modern web and mobile development technologies. He has experience in Java, JavaScript, Golang and a variety of frameworks such as Angular, NativeScript, and Apache Cordova. Nic writes about his development experiences related to making web and mobile development easier to understand.","sameAs":["https:\/\/www.thepolyglotdeveloper.com","https:\/\/www.facebook.com\/thepolyglotdeveloper","https:\/\/x.com\/nraboy"],"url":"https:\/\/www.couchbase.com\/blog\/author\/nic-raboy-2\/"}]}},"authors":[{"term_id":9032,"user_id":63,"is_guest":0,"slug":"nic-raboy-2","display_name":"Nic Raboy, Developer Advocate, Couchbase","avatar_url":"https:\/\/secure.gravatar.com\/avatar\/bedeb68368d4681aca4c74fe5f697f0c423b80d498ec50fd915ba018b72c101f?s=96&d=mm&r=g","author_category":"","last_name":"Raboy","first_name":"Nic","job_title":"","user_url":"https:\/\/www.thepolyglotdeveloper.com","description":"Nic Raboy is an advocate of modern web and mobile development technologies. He has experience in Java, JavaScript, Golang and a variety of frameworks such as Angular, NativeScript, and Apache Cordova. Nic writes about his development experiences related to making web and mobile development easier to understand."}],"_links":{"self":[{"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/posts\/2490","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/users\/63"}],"replies":[{"embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/comments?post=2490"}],"version-history":[{"count":0,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/posts\/2490\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/media\/13873"}],"wp:attachment":[{"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/media?parent=2490"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/categories?post=2490"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/tags?post=2490"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.couchbase.com\/blog\/wp-json\/wp\/v2\/ppma_author?post=2490"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}