Skip to content

Commit 5f4b170

Browse files
committed
Add Ivy questions
1 parent 8d1ba34 commit 5f4b170

File tree

4 files changed

+56
-0
lines changed

4 files changed

+56
-0
lines changed

README.md

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,12 @@
117117
|109| [What are the design goals of service workers?](#what-are-the-design-goals-of-service-workers)|
118118
|110| [What are the differences between AngularJS and Angular with respect to dependency injection?](#what-are-the-differences-between-angularjs-and-angular-with-respect-to-dependency-injection)|
119119
|111| [What is Angular Ivy?](#what-is-angular-ivy)|
120+
|112| [What are the features included in ivy preview?](#what-are-the-features-included-in-ivy-preview)|
121+
|113| [Can I use AOT compilation with Ivy?](#can-i-use-aot-compilation-with-ivy)|
122+
|114| [What is Angular Language Service?](#what-is-angular-language-service)|
123+
|115| [How do you install angular language service in the project?](#how-do-you-install-angular-language-service-in-the-project)|
124+
|116| [Is there any editor support for Angular Language Service?](#is-there-any-editor-support-for-angular-language-service)|
125+
|117| [Explain the features provided by Angular Language Service?](#explain-the-features-provided-by-angular-language-service)|
120126

121127
1. ### What is Angular Framework?
122128

@@ -1519,3 +1525,53 @@
15191525
}
15201526
}
15211527
```
1528+
112. ### What are the features included in ivy preview?
1529+
You can expect below features with Ivy preview,
1530+
1. Generated code that is easier to read and debug at runtime
1531+
2. Faster re-build time
1532+
3. Improved payload size
1533+
4. Improved template type checking
1534+
113. ### Can I use AOT compilation with Ivy?
1535+
Yes, it is a recommended configuration. Also, AOT compilation with Ivy is faster. So you need set the default build options(with in angular.json) for your project to always use AOT compilation.
1536+
```javascript
1537+
{
1538+
"projects": {
1539+
"my-project": {
1540+
"architect": {
1541+
"build": {
1542+
"options": {
1543+
...
1544+
"aot": true,
1545+
}
1546+
}
1547+
}
1548+
}
1549+
}
1550+
}
1551+
```
1552+
114. ### What is Angular Language Service?
1553+
The Angular Language Service is a way to get completions, errors, hints, and navigation inside your Angular templates whether they are external in an HTML file or embedded in annotations/decorators in a string. It has the ability to autodetect that you are opening an Angular file, reads your `tsconfig.json` file, finds all the templates you have in your application, and then provides all the language services.
1554+
115. ### How do you install angular language service in the project?
1555+
You can install Angular Language Service in your project with the following npm command
1556+
```javascript
1557+
npm install --save-dev @angular/language-service
1558+
```
1559+
After that add the following to the "compilerOptions" section of your project's tsconfig.json
1560+
```javascript
1561+
"plugins": [
1562+
{"name": "@angular/language-service"}
1563+
]
1564+
```
1565+
**Note:** The completion and diagnostic services works for .ts files only. You need to use custom plugins for supporting HTML files.
1566+
116. ### Is there any editor support for Angular Language Service?
1567+
Yes, Angular Language Service is currently available for Visual Studio Code and WebStorm IDEs. You need to install angular language service using an extension and devDependency respectively. In sublime editor, you need to install typescript which has has a language service plugin model.
1568+
117. ### Explain the features provided by Angular Language Service?
1569+
Basically there are 3 main features provided by Angular Language Service.
1570+
1. **Autocompletion:** Autocompletion can speed up your development time by providing you with contextual possibilities and hints as you type with in an interpolation and elements.
1571+
![ScreenShot](images/language-completion.gif)
1572+
2. **Error checking:** It can also warn you of mistakes in your code
1573+
![ScreenShot](images/language-error.gif)
1574+
3. **Navigation:** Navigation allows you to hover a component, directive, module and then click and press F12 to go directly to its definition.
1575+
![ScreenShot](images/language-navigation.gif)
1576+
1577+

images/language-completion.gif

132 KB
Loading

images/language-error.gif

274 KB
Loading

images/language-navigation.gif

857 KB
Loading

0 commit comments

Comments
 (0)