Sunday, April 2, 2017

Linking to external URL with appended tracking code in Ionic 2

By Hường Hana 9:30 AM , , , Leave a Comment

I wish to have a unique http link to an external URL, pulled from my JSON data, from within the detail pages of my app.

I have installed the inappbrowser plugin that currently works with a static url going to apple.com. However, I wish to use a product specific link url from my JSON data. Here is the JSON data, it is the "aw_deep_link" I wish to use.

How can I link to an external URL pulled from an Angular expression using my Buy Button on the detail page and then append some Google Analytics tracking code to the end of the URL?

Here is the Google Tracking Code I want to append:

?utm_source=app&utm_medium=android

Here is the Plunker currently working with a static url on the detail pages.

DETAIL.TS

openUrl() {          this.platform.ready().then(() => {             let browser = new InAppBrowser("http://www.apple.com",'_blank');             // let browser = new InAppBrowser("www.apple.com$?utm_source=app&utm_medium=android",'_blank');             // let browser = new InAppBrowser("{data.aw_deep_link}",'_blank');           }); }

DETAIL.HTML

<button (click)="openUrl()" ion-item>Buy Now</button>

Here is a similar concept used for Twitter pages in the Ionic Conference App

https://github.com/driftyco/ionic-conference-app/blob/master/src/pages/speaker-list/speaker-list.html

1 Answers

Answers 1

You weren't taking a url param in openUrl function.

<button (click)="openUrl(data.aw_deep_link)" ion-item>Buy Now</button>  openUrl(url) {     this.platform.ready().then(() => {         let browser = new InAppBrowser(`${url}?utm_source=app&utm_medium=android`,'_blank');         }); }
If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment