Skip to content

Commit 60637b8

Browse files
committed
docs(context-outlet-typed): update content
1 parent 849b90a commit 60637b8

File tree

1 file changed

+11
-7
lines changed

1 file changed

+11
-7
lines changed

docs/src/content/docs/challenges/angular/4-context-outlet-typed.md

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,30 +16,34 @@ sidebar:
1616

1717
## Information
1818

19-
Angular offer the static function [`ngTemplateContextGuard`](https://angular.io/guide/structural-directives#typing-the-directives-context) to strongly type structural directive.
19+
You can improve template type checking for custom directives by adding template guard properties to your directive definition. Angular offer the static function [`ngTemplateContextGuard`](https://angular.io/guide/structural-directives#typing-the-directives-context) to strongly type structural directives.
2020

2121
However the context of **NgTemplateOutlet** type is **Object**. But with the help of the above guard, we can improve that behavior.
2222

23+
If you’re not very familiar with `ngTemplateOutlet`, check out this article.
24+
25+
- [NgTemplateOutlet Type Checking](https://medium.com/@thomas.laforge/ngtemplateoutlet-type-checking-5d2dcb07a2c6)
26+
2327
## Statement
2428

25-
In this exercise, we want to learn how to strongly type our ng-template in our AppComponent.
29+
In this exercise we want to learn how to strongly type our `ng-template` in our `AppComponent`.
2630

2731
This exercise has two levels of complexity.
2832

29-
### Level 1: known Interface
33+
### Level 1: Known Interface
3034

3135
Currently we have the following piece of code.
3236

3337
![Unkown Person](../../../../assets/4/unknown-person.png 'Unkown Person')
3438

35-
As we can see, name is of type "any". We want to infer the correct type.
39+
As we can see `name` is of type `any`. We want to infer the correct type using a custom directive `PersonDirective`.
3640

37-
### Level 2: generic Interface
41+
### Level 2: Generic Interface
3842

3943
Currently we have the following piece of code.
4044

4145
![Unkown Student](../../../../assets/4/unknown-student.png 'Unkown Student')
4246

43-
As we can see, student is of type "any". We want to infer the correct type.
47+
As we can see `student` is of type `any`. We want to infer the correct type using a custom directive `ListDirective`.
4448

45-
But in this part, we can pass to ListComponent, a list of **any object**. And we still want the correct type to be inferred.
49+
But in this part, we want to pass a list of **any object** to `ListComponent`. And we still want the correct type to be inferred.

0 commit comments

Comments
 (0)