kudago / smart-app-banner

Lightweight smart app banner with no jquery requirement
MIT License
526 stars 250 forks source link

Angular 4 #99

Open felipelopes6 opened 6 years ago

felipelopes6 commented 6 years ago

How can I use with angular 4+ version?

I tried this https://github.com/kudago/smart-app-banner/issues/81 solution, but it doesn't work

felipelopes6 commented 6 years ago

So, I found this solution:

I opened my typing.d.ts and then:

declare class SmartBanner {
  constructor (object: any) 
}

and in the app.component.ts I implemented a AfterViewInit:

ngAfterViewInit() {    

    new SmartBanner({
      daysHidden: 15,   // days to hide banner after close button is clicked (defaults to 15)
      daysReminder: 90, // days to hide banner after "VIEW" button is clicked (defaults to 90)
      appStoreLanguage: 'us', // language code for the App Store (defaults to user's browser language)
      title: 'MyPage',
      author: 'MyCompany LLC',
      button: 'VIEW',
      store: {
          ios: 'On the App Store',
          android: 'In Google Play',
          windows: 'In Windows store'
      },
      price: {
          ios: 'FREE',
          android: 'FREE',
          windows: 'FREE'
      }
      // , theme: '' // put platform type ('ios', 'android', etc.) here to force single theme on all device
      // , icon: '' // full path to icon image if not using website icon image
      // , force: 'ios' // Uncomment for platform emulation
    });
  }

And works fine!

screen shot 2018-02-27 at 11 25 05

GabLeRoux commented 6 years ago

Thanks for sharing this, we should add this to the documentation.

AkashSurana commented 6 years ago

I'm new to Angular 2 Can you please give more details like:

  1. How did you create your own .d.ts file and in which folder ?
  2. How did you import your folder in the angular project ?
  3. Where are you using the meta tags ? inside your index.html or inside your component ?