Tips for Implementing CdvPurchase.Store in Angular

Is there a way to configure cordova-plugin-purchase v13 in conjunction with Angular 15?

Here is a snippet of what I have attempted. Below is my PaymentService class that is set to be provided at the root level.

// payment.service.ts
import { Injectable } from '@angular/core';
import { Platform } from '@ionic/angular';
import 'cordova-plugin-purchase';

@Injectable({
  providedIn: 'root'
})
export class PaymentService {

  constructor(
    private readonly store: CdvPurchase.Store,
    private readonly platform: Platform,
  ) {

    this.platform.ready().then((readySource) => {
      this.store.initialize();
    });
  }
}

I have included the Store class in the AppModule

// app.module.ts
import 'cordova-plugin-purchase';

@NgModule({
    // Irrelevant parts omitted
    providers: [
        {
            provide: CdvPurchase.Store,
            useFactory: () => { return window.CdvPurchase.Store }
        }
    ]
})
export class AppModule { }

Initially, I encounter an error in app.module.ts

Uncaught ReferenceError: CdvPurchase is not defined

Later on, I face a dependency injection error as mentioned below

ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(PaymentModule)[PaymentService -> PaymentService -> Store -> Store -> Store]: 
  NullInjectorError: No provider for Store!
NullInjectorError: R3InjectorError(PaymentModule)[PaymentService -> PaymentService -> Store -> Store -> Store]: 

Any help would be greatly appreciated.

Answer №1

@NgModule({ selector: 'app-answers', templateUrl: './napp2.page.html' , providers: [{provide: CdvPurchase.Store}]

})

This solution worked perfectly for my situation

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Changing the story in javascript

I am trying to customize the legend to display the following values: 80+ (or 80%+) 75-80 70-75 65-70 60-65 55-50 <50% While I have organized the list in descending order, I seem to be facing an issue with getting the less than symbol to function corr ...

iPad problem resolved: Disable click hover and double-click issue

I'm experiencing a problem with my web application specifically on Safari for iPad. I have to click twice in order to actually perform the click on the <a> tag. The first click triggers a hover effect, similar to when you hover with a mouse on d ...

Why might the Bootstrap menu be malfunctioning?

The reality is that Bootstrap is functional and widely used. Sharing the code could make a big difference in getting assistance! <ul class="top-header-contact-info secondary-menu"> <li class="nav-item dropdown-toggle"> ...

Retrieve the URL redirected by JavaScript without altering the current page using Selenium

Is there a way to extract the URL I am supposed to be redirected to upon clicking a button on a website, without actually being redirected? The button triggers a complex Javascript function and is not a simple hyperlink. click() method doesn't meet my ...

Error message occurred stating "error running npm start due to spawn C:WINDOWSSystem32WindowsPowerShellv1.0powershell ENOENT"

Whenever I attempt to run npm start, this is the issue that arises. It seems like there might be a problem with PowerShell rather than npm because npm successfully starts the development server. By the way, I created a basic React app using npx create-reac ...

Angular outputting a basic static value

After searching extensively for a solution to my issue with Angular output, I have only come across ways to emit events. In my specific scenario, I have a parent component containing a router, and I need to dynamically change the title based on a value f ...

"Utilizing an interceptor and retryWhen to automatically retry HTTP requests upon encountering a specific error

My service is set up to make a call to a GET API and then receive a response. I've integrated an HTTP Interceptor to effectively manage any errors that occur throughout the application. However, I have a specific requirement where if the API returns a ...

Utilize the three.js library within a Vue component by importing it and incorporating its

Can someone please help me understand the proper way to import and utilize the three.js library in a vue component? Despite my extensive research, it seems that most individuals use the following code line to import three.js into a vue component. However, ...

Activate the Bootstrap Jquery/Ajax inline editing feature by simply clicking on the Edit button

Seeking recommendations for a way to implement inline editing. When the edit button is clicked, I want the label's content to be replaced with an input text field that can be updated in my MySQL database. This is what my code looks like: <label s ...

Encountered an issue while attempting to integrate Nebular into my Angular application

As a newcomer to Angular, I decided to try installing Nebular using the command ng add @nebular/theme. However, I encountered an error in the process. Upon entering the command into my terminal, the following error message appeared: ? Which Nebular theme ...

HTML5 canvas game issue: background fails to load

I'm a beginner at designing games using HTML5 canvas. I've been following a tutorial on creating games in the style of Angry Birds from the 'pro html5 games' book. I've completed all the steps in the tutorial, but I'm facing a ...

jQuery: Managing and modifying values for dynamically generated input elements

Hello, I am currently working with the latest version of jQuery and have a table set up where clicking on the "Add" button appends a row of inputs. My goal is to calculate the total price for each particular product based on keyup events (i.e., qty * price ...

Tips for sending an object in AngularJS to the HTTPOST method

I am facing an issue where I am trying to pass an object to my controller using the $http method, but even though the object has a value, the data being passed is showing as NULL. Below is the code snippet that demonstrates this problem. Within my JavaScr ...

Tips for converting a URL to the correct route in emberjs when the location type is set to history

After creating a basic Ember.js application and setting the router location type to 'history', I encountered an issue with the generated URLs. Instead of the expected URL format like http://localhost/#/post/1, the Ember.js application was changi ...

Issues arise with PrimeNG multiselect onItemClick functionality following an update to version 7

I am currently working with a MultiSelectComponent that extends the primeng MultiSelect functionality. Recently, I updated from version 6.1.6 to 7.0.4. <ul class="not-important" <li *ngFor="let option of options; let i = index" class="not-import ...

Setting a default date dynamically for v-date-picker in the parent component, and then retrieving the updated date from the child component

I'm working with a custom component that utilizes the v-date-picker in various instances. My goal is to have the ability to dynamically set the initial date from the parent component, while also allowing the date to be modified from the child componen ...

Error encountered while unit testing a class decorator with type mismatch

I have been tasked with implementing a class decorator that adds an "identify" class method, which returns a class name with the information passed in the decorator. For example : @identifier('example') class Test {} const test = n ...

Node.js and Couchbase integration: A closer look at the functionality of the add() method

As I dive into learning about couchbase, I encountered a basic issue with inserting data using the add() method in my couchbase instance. Despite troubleshooting, something seems amiss in my code and I'm unable to pinpoint the exact reason. var http ...

Angular application using ngrx-store-localstorage does not retain data after a page refresh

Looking to incorporate ngrx into my authentication flow with the help of ngrx-store-localstorage for token persistence between browser sessions. After logging in, I can see the token value stored like this: {"token":{"token":"e5cb6515-149c-44df-88d1-4ff1 ...

Are There Data Racing Issues in JavaScript?

Imagine executing the following code snippet. let score = 0; for (let i = 0; i < some_length; i++) { asyncFunction(i, function() { score++; }); // incrementing callback function } The code above may potentially lead to a data race issue where two ...