🅰️NGULAR1️⃣6️⃣: How can you make an input property required in Angular 16 using the new syntax?

🅰️NGULAR1️⃣6️⃣: How can you make an input property required in Angular 16 using the new syntax?

* @Input({ required: true }) name: string;

* @Input('name', { required: true }) name: string;

* @Input() name: string = required;

* @Input() required name: string;

#angular #angular16 #interviewquestion #fullstack

Answer:

With Angular 16, you can use the {𝑟𝑒𝑞𝑢𝑖𝑟𝑒𝑑:𝑡𝑟𝑢𝑒} option for an @𝐼𝑛𝑝𝑢𝑡() decorator to make a property mandatory.

This means that the component will only work if you pass a value for that property.

Code snippet:

Error:

If the name property of GreetingComponent is not filled, the error message will be something like this:

Error: Missing required @Input() for component GreetingComponent: name

GitHub Demo: https://github.com/vinny59200/VV-ng16-reuired-input