Wolfgang Stengel
Wolfgang Stengel

Reputation: 2856

Angular template variables not resolved in PhpStorm

I have an Angular 7 app in PhpStorm and resolution via ctrl click in templates works for everything (Angular specific attributes like *ngIf, custom component tags or pipes) but not for local variables.

For example I have this component:

import { Component } from '@angular/core';

Component({
    selector: 'test-component',
    templateUrl: './test.component.html'
});
export class TestComponent {
    public list: string[];
}

With this template:

<ng-container *ngFor="let x of list">
    Hello {{x}}
</ng-container>

I can ctrl click on the imported module @angular/core to go to the definition, ctrl click on *ngFor to jump to the declarations file, click on {{x}} to jump to the *ngFor/let etc,. but I can NOT click on list to jump to the declaration in the .ts file. It's also rendered in red with the comment "unresolved variable or type".

I have node_modules installed, part of the project and not excluded. All Typescript and Angular autocomplete etc. works, except for template variables.

PhpStorm is 2019.2.3, the Angular plugin is installed and configured. I already have tried invalidate caches, re-index and re-start.

Upvotes: 0

Views: 764

Answers (1)

Wolfgang Stengel
Wolfgang Stengel

Reputation: 2856

Turns out I had the .html extension assigned to PHP (because I have many legacy files in the project). Curiously all Angular completion mechanics worked except for template variables. Assigning .html to Angular in the File Types area solved the problem.

Upvotes: 1

Related Questions