docs: update the syntax highlighting for angular (#7762)

TanStack · Jul 19, 2024 · 2786196 · 2786196
1 parent b189e31
commit 2786196
Show file tree

Hide file tree

Showing 11 changed files with 19 additions and 19 deletions.
diff --git a/docs/framework/angular/devtools.md b/docs/framework/angular/devtools.md
@@ -29,7 +29,7 @@ Floating Mode will mount the devtools as a fixed, floating element in your app a
 
 Place the following code as high in your Angular app as you can. The closer it is to the root of the page, the better it will work!
 
-```ts
+```angular-ts
 import { AngularQueryDevtools } from '@tanstack/angular-query-devtools-experimental'
 import { Component } from '@angular/core';
 

diff --git a/docs/framework/angular/guides/background-fetching-indicators.md b/docs/framework/angular/guides/background-fetching-indicators.md
@@ -6,7 +6,7 @@ ref: docs/framework/react/guides/background-fetching-indicators.md
 
 [//]: # 'Example'
 
-```ts
+```angular-ts
 @Component({
   selector: 'posts',
   template: `
@@ -39,7 +39,7 @@ export class TodosComponent {
 [//]: # 'Example'
 [//]: # 'Example2'
 
-```ts
+```angular-ts
 import { injectIsFetching } from '@tanstack/angular-query-experimental'
 
 @Component({

diff --git a/docs/framework/angular/guides/disabling-queries.md b/docs/framework/angular/guides/disabling-queries.md
@@ -7,7 +7,7 @@ replace: { 'useQuery': 'injectQuery' }
 
 [//]: # 'Example'
 
-```ts
+```angular-ts
 @Component({
   selector: 'todos',
   template: `<div>
@@ -44,7 +44,7 @@ export class TodosComponent {
 [//]: # 'Example'
 [//]: # 'Example2'
 
-```ts
+```angular-ts
 @Component({
   selector: 'todos',
   template: `
@@ -69,7 +69,7 @@ export class TodosComponent {
 [//]: # 'Example2'
 [//]: # 'Example3'
 
-```ts
+```angular-ts
 @Component({
   selector: 'todos',
   template: `

diff --git a/docs/framework/angular/guides/infinite-queries.md b/docs/framework/angular/guides/infinite-queries.md
@@ -8,7 +8,7 @@ replace:
 
 [//]: # 'Example'
 
-```ts
+```angular-ts
 import { Component, computed, inject } from '@angular/core'
 import { injectInfiniteQuery } from '@tanstack/angular-query-experimental'
 import { lastValueFrom } from 'rxjs'
@@ -48,7 +48,7 @@ export class Example {
 }
 ```
 
-```html
+```angular-html
 <div>
   @if (query.isPending()) {
   <p>Loading...</p>
@@ -70,7 +70,7 @@ export class Example {
 [//]: # 'Example'
 [//]: # 'Example1'
 
-```ts
+```angular-ts
 @Component({
   template: ` <list-component (endReached)="fetchNextPage()" /> `,
 })

diff --git a/docs/framework/angular/guides/mutations.md b/docs/framework/angular/guides/mutations.md
@@ -14,7 +14,7 @@ replace:
 
 [//]: # 'Example'
 
-```ts
+```angular-ts
 @Component({
   template: `
     <div>
@@ -45,7 +45,7 @@ export class TodosComponent {
 [//]: # 'Example2'
 [//]: # 'Example3'
 
-```ts
+```angular-ts
 @Component({
   standalone: true,
   selector: 'todo-item',

diff --git a/docs/framework/angular/guides/optimistic-updates.md b/docs/framework/angular/guides/optimistic-updates.md
@@ -28,7 +28,7 @@ addTodo = injectMutation(() => ({
 [//]: # 'ExampleUI1'
 [//]: # 'ExampleUI2'
 
-```ts
+```angular-ts
 @Component({
   template: `
     @for (todo of todos.data(); track todo.id) {
@@ -45,7 +45,7 @@ class TodosComponent {}
 [//]: # 'ExampleUI2'
 [//]: # 'ExampleUI3'
 
-```ts
+```angular-ts
 @Component({
   template: `
     @if (addTodo.isError()) {

diff --git a/docs/framework/angular/guides/paginated-queries.md b/docs/framework/angular/guides/paginated-queries.md
@@ -22,7 +22,7 @@ const result = injectQuery(() => ({
 [//]: # 'Example'
 [//]: # 'Example2'
 
-```ts
+```angular-ts
 @Component({
   selector: 'pagination-example',
   template: `

diff --git a/docs/framework/angular/guides/queries.md b/docs/framework/angular/guides/queries.md
@@ -33,7 +33,7 @@ result = injectQuery(() => ({ queryKey: ['todos'], queryFn: fetchTodoList }))
 [//]: # 'Example2'
 [//]: # 'Example3'
 
-```ts
+```angular-ts
 @Component({
   selector: 'todos',
   standalone: true,
@@ -66,7 +66,7 @@ If booleans aren't your thing, you can always use the `status` state as well:
 
 [//]: # 'Example4'
 
-```ts
+```angular-ts
 @Component({
   selector: 'todos',
   standalone: true,

diff --git a/docs/framework/angular/guides/query-cancellation.md b/docs/framework/angular/guides/query-cancellation.md
@@ -81,7 +81,7 @@ You might want to cancel a query manually. For example, if the request takes a l
 
 [//]: # 'Example7'
 
-```ts
+```angular-ts
 @Component({
   standalone: true,
   template: `<button (click)="onCancel()">Cancel</button>`,

diff --git a/docs/framework/angular/overview.md b/docs/framework/angular/overview.md
@@ -60,7 +60,7 @@ In the example below, you can see Angular Query in its most basic and simple for
 
 [Open in CodeSandbox](https://codesandbox.io/s/github/tanstack/query/tree/main/examples/angular/simple)
 
-```ts
+```angular-ts
 import { AngularQueryDevtools } from '@tanstack/angular-query-devtools-experimental'
 import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
 import { HttpClient } from '@angular/common/http'

diff --git a/docs/framework/angular/quick-start.md b/docs/framework/angular/quick-start.md
@@ -43,7 +43,7 @@ export class AppModule {}
 
 ### Component with query and mutation
 
-```ts
+```angular-ts
 import { Component, Injectable, inject } from '@angular/core'
 import { HttpClient } from '@angular/common/http'
 import { lastValueFrom } from 'rxjs'