Resolving a persistent AngularJS 1 constant problem with Typescript

I'm currently developing an application using TypeScript and AngularJS 1, and I've encountered a problem while trying to create a constant and passing it to another class. The constant in question is as follows:

module app{
       export class AUTH_EVENTS {
            static get Default():any {
                    return {
                    LOGIN_SUCCESS: 'AUTH_EVENTS:LOGIN_SUCCESS',
                    LOGIN_FAILED: 'AUTH_EVENTS:LOGIN_FAILED',
                    LOGOUT_SUCCESS: 'AUTH_EVENTS:LOGOUT_SUCCESS',
                    LOGOUT_FAILED: 'AUTH_EVENTS:LOGOUT_FAILED',
                    SESSION_TIMEOUT: 'AUTH_EVENTS:SESSION_TIMEOUT',
                    NOT_AUTHORIZED: 'AUTH_EVENTS:NOT_AUTHORIZED'
                };
            }
        }
 var myApp = getModule();
 myApp.constant("AUTH_EVENTS", AUTH_EVENTS.Default())
}

I'm attempting to access the constant here:

module app{
    class auth{

        constructor(public $q: ng.IQService,
            public $state:angular.ui.IState, 
            public AUTH_EVENTS: AUTH_EVENTS){
        }

             responseError(response:any) {
                if (response.status === 401) {
                    console.log(this.AUTH_EVENTS.LOGIN_SUCCESS);
                } 
                return this.$q.reject(response);
        }


    }
}

However, when I try to access

console.log(this.AUTH_EVENTS.LOGIN_SUCCESS) 

, I receive an error stating that LOGIN_SUCCESS is not defined.

Can anyone offer insight as to why this might be happening? Is there an issue with how the constant is defined or perhaps with the auth class itself? Specifically, this is the error message I get when compiling TS into JS:

error TS2339: Property 'LOGIN_SUCCESS' does not exist on type 'AUTH_EVENTS'.

Answer №1

Consider the following definition:

module app{ 
   export class AUTH_EVENTS {       
       LOGIN_SUCCESS= 'AUTH_EVENTS:LOGIN_SUCCESS';
       LOGIN_FAILED= 'AUTH_EVENTS:LOGIN_FAILED';
       LOGOUT_SUCCESS= 'AUTH_EVENTS:LOGOUT_SUCCESS';
       LOGOUT_FAILED= 'AUTH_EVENTS:LOGOUT_FAILED';
       SESSION_TIMEOUT= 'AUTH_EVENTS:SESSION_TIMEOUT';
       NOT_AUTHORIZED= 'AUTH_EVENTS:NOT_AUTHORIZED';
       static  Default() { return new AUTH_EVENTS(); }
    }
  var app = getModule();
  app.constant("AUTH_EVENTS", AUTH_EVENTS.Default())
}

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

Cross-origin resource sharing (CORS) seems to be creating a barrier for the communication between my Angular

During the process of developing an Angular and NestJS app with NGXS for state management, I encountered a CORS error while serving my application. The error message in the console indicated: Access to XMLHttpRequest at 'localhost:333/api/product-i ...

Encountering difficulties when attempting to upload a file to Google Cloud Platform using Multer in a Node.js

I am currently experimenting with uploading a single file using Multer and the "multipart/form-data" content type to a Google Cloud Storage bucket. For this task, I am utilizing "Multer.memoryStorage()" and "@google-cloud/storage" try { const docume ...

Various conditional statements based on the dropdown menu choice

I currently have a basic dropdown menu on my webpage that enables users to switch between viewing Actual or Planned dates/times in a table (I am utilizing the controller as syntax): <select ng-model="trip.viewType"> <option value="actual"> ...

Sinon Stub generates varying values with each invocation

I'm pretty new to TypeScript and JavaScript, but I've managed to create a functioning VScode extension that I'm really happy with. However, I'm running into some issues with my Mocha tests. Here's a snippet of the code I'm str ...

Tips for effectively utilizing TypeORM transactions

I'm encountering an issue with transactions in TypeORM. Here's a snippet of the code causing me trouble: const someFunction = async () => { try { await this.entityManager.transaction(async (manager) => { //some opera ...

Generating a new object using an existing one in Typescript

I received a service response containing the following object: let contentArray = { "errorMessages":[ ], "output":[ { "id":1, "excecuteDate":"2022-02-04T13:34:20" ...

Troubleshooting a child process created by electron in Visual Studio Code

I am currently in the process of developing an electron application using typescript and webpack. I have encountered a specific debugging issue with vscode that I would like some assistance with: Context: The main process initiates a child process by call ...

Adding a new line in the configurations of MatDialogConfig (Angular)

Here is a code snippet: private mDialog: MatDialog, const dialog = new MatDialogConfig(); msg = "I enjoy coding in Angular.\r\n I am learning TypeScript." dialog.data = { message:msg }; alert (msg); mDialog.open(AB ...

Achieve consistent action execution for both the footer and header included in all pages using AngularJS

This particular query has a significant possibility of being considered a duplicate, but in my attempts to find a satisfactory explanation for my problem through various searches, I have not been successful - so please accept my apologies if this is indeed ...

Applying a Typescript Generic to enhance the functionality of the API fetcher

I've written a simple function to enhance fetch functionality. I am currently exploring how TypeScript Generics can be utilized to define the Type for 'data' in the return. const apiFetchData = async ( url: string, options = {}, ): P ...

Tips for utilizing <Omit> and generic types effectively in TypeScript?

I'm currently working on refining a service layer in an API with TypeScript by utilizing a base Data Transfer Object. To prevent the need for repetitive typing, I have decided to make use of the <Omit> utility. However, this has led to some per ...

What could be the reason my AngularJS dropdown is not getting populated?

Below is the select code snippet: <select class="dropdownInForm" ng-model="vehicle"> <option ng-repeat="vehicle in vehicles" value="vehicle.VehicleID">{{vehicle.VehicleName}}</option> </select> The data loading logic in the an ...

Initial position of the range slider in IONIC 2

I have been searching the web extensively to find a solution to this particular issue. I am working with a range slider and trying to set its default starting values, but so far, I haven't had any luck. I've checked both the official documentatio ...

Typescript excels at gracefully handling cases where an element is not found

While working with Typescript-Protractor Jasmine, I encountered an issue where the test case (the 'it' block) is not failing when an element is not found. Instead, it shows an UnhandledPromiseRejectionWarning but still marks the script as passed. ...

The $resources headers have not been updated

My objective is to include a header with each HTTP request for an ngResource (specifically, an auth token). This solution somewhat accomplishes that: app.factory('User', ['$resource','$window', function($resource,$window,l ...

I seem to be failing at properly executing Promises... What crucial element am I overlooking in this process?

Within my project, there exists a file named token.ts which contains a function that exports functionality: import * as jwt from 'jsonwebtoken'; import { db, dbUserLevel } from '../util/db'; export function genToken(username, passwor ...

CKEditor directive in AngularJS does not properly enforce the maxlength attribute in textarea

I am currently working on an AngularJS application with the CKEditor plugin. I have created a directive for CKEditor and everything seems to be functioning properly. However, I am facing an issue where I need to limit the character length to 50. I tried us ...

Issue encountered with UglifyJs - Unexpected token: title (Subject)

My attempt to deploy my initial Angular application is not going smoothly. The build process fails and the error message I'm encountering states: ERROR in vendor.809dd4effe018f6b3d20.bundle.js from UglifyJs Unexpected token: name (Subject) [vendo ...

Unable to transfer files, encountering issues with PHP and AngularJS integration

I am currently working on uploading files using both AngularJS and PHP. For the AngularJS part, I am utilizing angular-file-upload from https://github.com/danialfarid/angular-file-upload. I suspect that the issue lies in my PHP code, as it fails to move ...

Manipulate CSS classes in an ng-repeat list using AngularJS

Dear colleagues, let's take a look at this clear example. [...document.querySelectorAll('.li-example')].forEach((s, i, arr) => { s.addEventListener('click', function() { [...document.querySelectorAll('.li-example&a ...