From 1b6679d851c0cb324586cc4077c4683933101597 Mon Sep 17 00:00:00 2001 From: Sven Brodny Date: Sun, 24 Mar 2024 18:16:46 +0100 Subject: [PATCH] docs(context-outlet-typed): fix typos and remove link --- .../challenges/angular/4-context-outlet-typed.md | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/docs/src/content/docs/challenges/angular/4-context-outlet-typed.md b/docs/src/content/docs/challenges/angular/4-context-outlet-typed.md index d5441e9..7f0f697 100644 --- a/docs/src/content/docs/challenges/angular/4-context-outlet-typed.md +++ b/docs/src/content/docs/challenges/angular/4-context-outlet-typed.md @@ -16,17 +16,13 @@ sidebar: ## Information -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. +You can improve template type checking for custom directives by adding template guard properties to your directive definition. Angular offers the static function [`ngTemplateContextGuard`](https://angular.io/guide/structural-directives#typing-the-directives-context) to strongly type structural directives. However the context of **NgTemplateOutlet** type is **Object**. But with the help of the above guard, we can improve that behavior. -If you’re not very familiar with `ngTemplateOutlet`, check out this article. - -- [NgTemplateOutlet Type Checking](https://medium.com/@thomas.laforge/ngtemplateoutlet-type-checking-5d2dcb07a2c6) - ## Statement -In this exercise we want to learn how to strongly type our `ng-template` in our `AppComponent`. +In this exercise, we want to learn how to strongly type our `ng-template` in our `AppComponent`. This exercise has two levels of complexity. @@ -36,7 +32,7 @@ Currently we have the following piece of code. ![Unkown Person](../../../../assets/4/unknown-person.png 'Unkown Person') -As we can see `name` is of type `any`. We want to infer the correct type using a custom directive `PersonDirective`. +As we can see, `name` is of type `any`. We want to infer the correct type using the custom directive `PersonDirective`. ### Level 2: Generic Interface @@ -44,6 +40,6 @@ Currently we have the following piece of code. ![Unkown Student](../../../../assets/4/unknown-student.png 'Unkown Student') -As we can see `student` is of type `any`. We want to infer the correct type using a custom directive `ListDirective`. +As we can see, `student` is of type `any`. We want to infer the correct type using the custom directive `ListDirective`. 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.