Angular 5 error: The property you are trying to access is not defined in

I've been working on a simple class and I'm stuck trying to figure out why the "currentHost" variable is showing as non-existent.

export class AppModule {
  public static currentHost: string = 'http://localhost:8080/';

  constructor() {
    if (window.location.hostname == "localhost") {
      this.currentHost = "http://" + window.location.hostname + "/";
    }
  }

}


ERROR in src/app/app.module.ts(62,12): error TS2339: Property 'currentHost' does not exist on type 'AppModule'.

Any ideas where I might have gone wrong?

angulartypescriptangular5

Answer №1

Eliminate the static keyword. Implement it in this manner

public  currentHost = 'http://localhost:8080/';

The string type is assumed for the value you specified.

Answer №2

It is typically not recommended to declare variables within a module; instead, they should be declared inside the specific component where you intend to utilize them.

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

Exploring the synergy between Visual Studio 2015 and Angular2 Beta 2's dependency injection functionality

Currently, I am using VS2015 alongside TypeScript 1.7.3 and Angular2 Beta 2 with a target of ECMA 5. In order to enable experimental decorators in my project, I have made modifications to the csproj file by including TypeScriptExperimentalDecorators = true ...

dependency-injectiontypescriptvisual-studio-2015angular

Guide to automatically blur the input field and toggle it upon clicking the checkbox using Angular

<input (click)="check()" class="checkbox" type="checkbox"> <input [(ngModel)]="second_month" value="2019-09" type="month" [class.blurred]="isBlurred">> I need the second input(type=month) field to be initially blurred, and only unblur ...

htmlangulartypescriptblur

What is the best way to expand all parent nodes of a specific child node in Angular 8 using the nested tree control of the mat tree?

getBookOutlineBar method is designed to take a list of nodes along with the selected node that needs to be highlighted when the outline sidebar opens. However, the current implementation only expands one specific node instead of all parent nodes. For exam ...

angulartreetreeviewmaterial-uimat

The Angular Password Strength Extension will display an error message if the password strength is below 100

It's frustrating to keep trying different methods to achieve a simple task. I have a reactive form and all I want is to display an error if the password strength is not 100, indicating that it does not meet all the requirements. I can easily access t ...

angularangular-material

Troubleshooting NGINX and NodeJS (Docker) issue on Synology Server

I've set up a docker-compose file that does the following: Starts Postgres DB Builds and starts NestJS (NodeJS) backend on localhost:3000 Builds and starts an Angular app on localhost:4200 inside of an NGINX container After following these instructi ...

node.jsangularnginxdocker-composenestjs

Guide to swapping out embedded objects within a TypeScript data structure

I am in need of modifying a TypeScript object by conducting a key search. It is important to note that the key may be repeated within the object, so I must ensure it belongs to the correct branch before making modifications to the corresponding object. To ...

typescript

The parameter type 'IScriptEditorProps' does not accept arguments of type 'string'

After trying numerous solutions, I decided to integrate this script editor into a SharePoint site. However, when attempting to implement it, I encountered an issue with the constructor lacking arguments. Despite my efforts to troubleshoot, I have been unab ...

typescriptsharepointconstructorweb-partssuper

Angular 8: ngx-socket-io changes the connection URL while in production mode

One issue arises when running the application in production mode. In development mode, the socket client successfully connects to http://localhost:3002/socket.io/?EIO=3&transport=polling&t=N4--_Ms. However, in production mode, the URL changes to ht ...

node.jsangularsocket.io

Running a script upon service initialization

Can code be run when a service is first initialized? For instance, if the product Service is being initialized, I'd like to execute the following code: this.var = this.sharedService.aVar; ...

javascriptangular

What is the best way to retrieve the dataset object from a chart object using chart.js in typescript?

Currently, I am facing a challenge in creating a new custom plugin for chart.js. Specifically, I am encountering a type error while attempting to retrieve the dataset option from the chart object. Below is the code snippet of the plugin: const gaugeNeedle ...

typescriptchart.js

Issues detected with the functionality of Angular HttpInterceptor in conjunction with forkJoin

I have a Service that retrieves a token using Observable and an HttpInterceptor to inject the token into every http request. It works seamlessly with a single request, but when using forkJoin, no response is received. Here is the code for the interceptor: ...

javascriptangulartypescriptrxjsangular6

What is the best way to interact with and modify the relationships of "many-to-many" fields in my database table?

As someone who is new to nestjs, I am working with two entities: @Entity({ name: "Books" }) @ObjectType() export class Book { @PrimaryGeneratedColumn() @Field() id: number; @Column() @Field() title: string; @ManyToMany(() => Auth ...

typescriptgraphqlnestjsapollotypeorm

Are my Angular CLI animations not working due to a version compatibility issue?

I've been working on a project that had Angular set up when I started. However, the animations are not functioning correctly. The mat input placeholder doesn't disappear when typing, and the mat-select drop-down is not working. Here is my packag ...

htmlcssangulartypescriptanimation

The inclusion of an XSRF-TOKEN using an HTTP Interceptor results in a 400 Error Request

Implementing XSRF-TOKEN to enhance security and prevent XSRF attacks as I pass a JWT through a cookie for my Angular application. Below is the structure of my HttpInterceptor. intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEv ...

phpangularhttp-headers

Button for enabling and disabling functionality, Delete list in Angular 2

I am looking to toggle between the active and inactive classes on a button element. For example, in this demo, there are 5 buttons and when I click on the first button it removes the last one. How can I remove the clicked button? And how do I implement the ...

angularjsangulartypescriptionic-framework

Ways to vertically adjust text using ngStyle depending on the condition

I've been attempting to conditionally align text using ngStyle, but I haven't had any success yet. This is the code I have come up with so far: <div [ngStyle]="{'display':totalRegisters<=10 ? 'inline-block; text-align: ...

angularangular-ui-bootstrap

VS Code using Vue is displaying an error message stating: The property '' does not exist on type '{}'.ts(2339)

While working in Visual Studio Code, I came across the following code snippet: <script lang="ts" setup> const parseCSV = () => { // Code omitted for brevity } } </script> <template> <button @click="parseCSV ...

typescriptvue.jsvisual-studio-code

Implementing dynamic styles for a checked mat-button-toggle in Angular 6

How can I customize my button-toggle when it is checked? The current code I have doesn't seem to be working... This is the code snippet: <mat-button-toggle-group #mytoggle (change)="selectoption($event)" value="{{num}}"> <mat-bu ...

htmlcssangulardynamicstyles

I'm new to NPM and Node.js and I'm currently exploring the differences between global and local dependencies installations, and how they are displayed in the package.json file

I'm primarily a designer who is diving into coding. Recently, I've been assisting with an Angular project at work and needed to learn how to utilize npm to install Angular CLI and its dependencies. Setting up my Angular project was a breeze. I m ...

node.jsangularnpmsass

Inheritance-based generic type inference in Typescript

Take a look at this piece of code: class A<T> { t?: T; } interface B {} class C implements A<B> {} function f<T1 extends A<T2>, T2>(a: T1): T2 | undefined { return a.t; } const result = f(new C()); const result2 = f(new A<B> ...

typescripttype-inference