Nsryjdtyk

HI there guy's i'm relatively new on Typescript and Angular and i try figure out in this case: i got the erro below error on ng build, but in ng serve everything going well.. Whats strange issue is this. Also i want to make some declaration privete but with private doesen't work. Need to understand more some tricks probably...

TS2304: Cannot find name 'ngRedux'.

import { Component, OnInit, AfterViewChecked, OnDestroy, ViewEncapsulation} from '@angular/core';

import { Subscription } from 'rxjs/Subscription';

import { MatDialog } from '@angular/material';

import { Http, Response, RequestOptions, Headers } from '@angular/http';

import { PayPalConfig, PayPalEnvironment, PayPalIntegrationType } from 'ngx-paypal';

import { MatRadioChange } from '@angular/material';

import { CookieService } from 'ngx-cookie-service';

import { UsersProvider} from '../../../../../providers/users.provider';

import { NgRedux } from '@angular-redux/store';

import {IAppState} from '../../../../../reducers';





declare let paypal: any;

@Component({

  selector     : 'abbonamento',

  templateUrl  : './abbonamento.component.html',

  styleUrls    : ['./abbonamento.component.scss'],

  encapsulation: ViewEncapsulation.None

})

export class AbbonamentoComponent implements OnInit, OnDestroy, AfterViewChecked

{

  addScript: boolean = false;

  paypalLoad: boolean = true;

  public finalAmount: number = 1;

  abbonamenti = ;

  caratteristiche = ;

  public PayPalConfig?: PayPalConfig;

  constructor(

    public http: Http,

    public cookieService: CookieService,

    public ngRedux: NgRedux<IAppState>,

  )

  {



  }



  ngOnInit()

  {

    this.http.get('https://dev.site.it/get-abbonamenti').map(res => res.json()).subscribe(data => {

      this.abbonamenti = data.abbonamenti;

      this.caratteristiche = data.caratteristiche;

    });

  }



  ngOnDestroy()

  {

  }





  payPalConfig = {

    env: 'sandbox',

    client: {

      sandbox: 'xxxxxxxxxxxxxxxxxxx',

      production: 'xxxxxxxxxxxxxxxxxxxxx'

    },

    commit: true,



    // payment() is called when the button is clicked

    payment: function (data, actions) {

      // Make a call to the REST api to create the payment

      let prezzo = cookieService.get('importo');

      return actions.payment.create({

        payment: {

          transactions: [

            {

              amount: {total: prezzo, currency: 'EUR'}

            }

          ]



        }

      })

    },

    // onAuthorize() is called when the buyer approves the payment

    onAuthorize: function (data, actions) {



      // Make a call to the REST api to execute the payment

      return actions.payment.execute().then((response) => {

        console.log(response);

        var data = {

          user_id: ngRedux.getState().session,

          dati_transazione: response,

        }

        http.post('https://dev.sito.it/aggiorna-abbonamento', data).subscribe(data=> {});

        window.alert('Pagamento confermato');

      });

    }

}



  pianoChange(event: MatRadioChange)

  {

    this.cookieService.set( 'importo', event.value );

  }





  ngAfterViewChecked(): void {

    if (!this.addScript) {

      this.addPaypalScript().then(() => {

          paypal.Button.render(this.payPalConfig, '#paypal-checkout-btn');

          this.paypalLoad = false;

        })

      }

  }



  addPaypalScript() {

    this.addScript = true;

    return new Promise((resolve, reject) => {

      let scripttagElement = document.createElement('script');

      scripttagElement.src = 'https://www.paypalobjects.com/api/checkout.js';

      scripttagElement.onload = resolve;

      document.body.appendChild(scripttagElement);

    })

  }



}

That's because you might have some variables declared as private but which are still being used in the template of a particular component.

The way around this is to make all those properties that you will be using in the template as public and the rest and private. Doing this should fix the issue for you.

The overall idea here is, if you want to use anything from a file outside that file, you'll have to declare it as public otherwise you're going to get errors while building.

Search for this line of the onAuthorize() function:

      user_id: ngRedux.getState().session,

Change it to this:

      user_id: this.ngRedux.getState().session,

You are accessing a class variable not a function local variable, so you need to specify the this keyword.

All this assumes that you have the @angular-redux library property installed as part of your project and that the NgRedux<IAppState> is set up as a provider in your @NgModule.