Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to show references coming from HTML-Files (Angular-Templates) in TypeScript files within VSCode?

As you know you can enable the following settings in VSCode to see the references in the editor:

"typescript.implementationsCodeLens.enabled": true,
"javascript.referencesCodeLens.enabled": true

As you see in the image below there are no references (See the code below and the grey reference-info-text above method-name 'myOperations') 0 references)

enter image description here

But in reality, it exists! It exists within an angular template:

<div class="some-cool-class">
  <my-super-thing
    *ngIf="ifItIsCool"
    (operations)="myOperations($event)"
  >
  </my-super-thing>

Can I handle that somehow? How can I see the references (method calls) from templates too?

like image 630
Lonely Avatar asked Sep 12 '19 08:09

Lonely


People also ask

How do you show references in VSCode?

You can use the Find All References command to find where particular code elements are referenced throughout your codebase. The Find All References command is available on the context (right-click) menu of the element you want to find references to. Or, if you are a keyboard user, press Shift + F12.

How Import HTML template into VSCode?

Open VSCode. Open the generated project. Press Ctrl + Shift ⇧ + P in Windows/Linux or Command ⌘ + Shift ⇧ + P in Mac to open VSCode's extension launcher. Type/Select Web Template Studio: Deploy Web App and press Enter to begin the deployment.


1 Answers

EDIT 26 Jan 2021 (from Johan Aspeling):

Seems to have finally been fixed with the new Ivy language service (used in Angular 11) Angular Language Service v11+

===

That feature is not supported in Angular's official language service.

There is an open issue to add it which is going completely ignored for over two years, and a second issue opened a year ago which is also being ignored.

like image 133
msanford Avatar answered Sep 29 '22 11:09

msanford