angular / angular/angular

[Feature request] Highlighting within inline templates

Open
#65,500 6 comments 7 reactions 0 assignees View on GitHub
area: vscode-extension feature
Dominant language
TypeScript
Stars
101k
Forks
27.5k
Avg merge
1d 19h
Merged PRs (30d)
288

Description

# 🚀 feature request

### Description
When the cursor is placed on any tag within an inline template, the entire template is highlighted. In external HTML templates, just the opening and the closing tag are highlighted. I assume this is the case because the language mode of the file is set to TypeScript, not HTML. I find this very annoying.

### Feature Type
What does this bug affect

- [x] Angular Language Service VSCode extension
- [ ] Angular Language Service server

### Describe the solution you'd like
Ideally the language mode of inline templates would be set to HTML.

### Describe alternatives you've considered
Have you considered any alternative solutions or workarounds?
I have tried using other extensions, like [Inline HTML](https://marketplace.visualstudio.com/items?itemName=pushqrdx.inline-html) that should change the language mode of template strings with moderate success.

### Anything else relevant?

How it is:
image
What I would expect:
image

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the highlighting behavior in the Angular Language Service VSCode extension with an inline template and an external HTML template. Trace how inline templates receive their language mode, then verify that only the matching opening and closing tags are highlighted and that the full template is no longer selected.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript, vscode
Domain
tooling
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.