After upgrading to Angular 16 I get errors when editing the components HTML because the Angular Language Service extension is not running properly.
[Info - 09:41:11] Angular language server process ID: 18032
[Info - 09:41:11] Using typescript/lib/tsserverlibrary v4.9.5 from c:\source\xxx\Angular16VsCodeTest\node_modules\typescript\lib\tsserverlibrary.js
[Info - 09:41:11] Using @angular/language-service v15.2.0 from c:\Users\xxx\.vscode\extensions\angular.ng-template-15.2.0\node_modules\@angular\language-service\index.js
[Info - 09:41:11] Logging is turned off. To enable, run command 'Open Angular server log'.
[Error - 09:41:14] Failed to run ngcc for c:/source/pgossmann/Angular16VsCodeTest/tsconfig.json, language service may not operate correctly:
Failed to resolve ngcc from c:/source/xxx/Angular16VsCodeTest
[Info - 09:41:14] Enabling Ivy language service for c:/source/xxx/Angular16VsCodeTest/tsconfig.json.
To reproduce I created 1. new Angular16 and 2. new Angular15 project from scratch, added imports for FormsModule, ReactiveFormsModule. Added following html in both:
<textarea class="" [formControl]="messageDetails" ></textarea>
In Angular 15 no error, everything is fine. In Angular 16 it complains that formControl isn't a known property, which is wrong.
How can I fix this? Is the Angular LanguageService just not updated for Angular-16?
As found in the comments by the asker, the issue was that newer versions of the extension need higher versions of VS Code that the asker hadn't updated to. After updating their VS Code, the extension installation worked.