From the course: Angular: Testing and Debugging
Understanding Angular decorators - Angular Tutorial
From the course: Angular: Testing and Debugging
Understanding Angular decorators
- [Instructor] Decorators are functions that return functions. That simple. But in Angular, they supply metadata about a particular class or property or value. And they also help with dependency injection across the entire app. They are built in from the ground up as part of the Angular framework. Decorators are marked by placing an @ symbol in front of the Decorator name. They are invoked at runtime and expect arguments to be passed in either between the parentheses or immediately after the closing parentheses of the Decorator. This is why semi-colons are left off the end of the Decorator expression and why parentheses, even empty ones, always follow the name of the Decorator. Common decorators are NGModule to define the modules, Component to define components, Injectable to define services, and Input and Output to define properties that are sent and received from the DOM. There are many built-in Decorators available in Angular and many properties on each Decorator. So I recommend you read the official Angular documentation for more information on Decorators and how they work in Angular projects. Common Decorator errors include missing parentheses, missing properties, missing values, or adding a semi-colon at the end of a Decorator statement. In older versions of Angular, Decorator errors were really hard to diagnose because Angular emitted errors only on execution in the browser console and not a compile time. In newer versions of Angular we get a lot more helpful feedback from the compiler and this makes diagnosing those issues much, much easier. You can use the NG build and NG serve commands that come with the Angular CLI tool to take advantage of this error reporting. NG build compiles your code and halts if there are errors. NG serve compiles your code, reports the errors, and continues watching for changes. Code editors like Visual Studio Code are also very helpful because they can reason about your files and give you real time feedback without even compiling the code.
Contents
-
-
-
-
-
(Locked)
Adding a local storage service4m 38s
-
(Locked)
Fixing dependency injection errors3m 38s
-
(Locked)
Getting and setting data in local storage3m 18s
-
(Locked)
Adding a custom Angular pipe4m 51s
-
Using regular expressions to find content4m 13s
-
(Locked)
Using a pipe to change HTML content4m 17s
-
(Locked)
Common pipe errors1m 53s
-
Understanding Angular decorators2m 6s
-
(Locked)
Challenge: Filter the array of users by locationId30s
-
(Locked)
Solution: Filter the array of users by locationId1m 23s
-
(Locked)
-
-
-
-
-