@Input() value is always undefined

by

It will be initialized in ngOnInit, not the constructor. (Please also review the Angular Life Cycle Hooks documentation.)

ngOnInit() {
  console.log('userId is:',this.userId);
}

Also if you want to pass a literal like a string and use brackets [] you have to pass it as a string by enclosing the value with single ticks.

<user-photos [userId]="'TestingInput'"></user-photos>

The reason for that is the containing expression is evaluated in the context of the containing component so without it it will try to retrieve and pass a property/field named TestingInput which will be undefined (unless you also happen have a field by that name).

More Related Contents:

  1. Loop add new record to array in typescript [closed]
  2. How can I use/create dynamic template to compile dynamic Component with Angular 2.0?
  3. Difference between Constructor and ngOnInit
  4. access key and value of object using *ngFor
  5. How to apply filters to *ngFor?
  6. How to inject window into a service?
  7. flatMap, flat, flatten doesn’t exist on type any[]
  8. Angular 2 – Execute code when closing window
  9. Angular 2 Form “Cannot find control with path”
  10. vs
  11. How to cancel/unsubscribe all pending HTTP requests in Angular 4+
  12. Angular 2 Basic Authentication not working
  13. How to smooth scroll to page anchor in angular 4 without plugins properly?
  14. Angular 2 + Ionic 2: Detect if an object was modified
  15. Http.get() working but not working in build(Release/Debug) in Ionic 4
  16. Property ‘json’ does not exist on type ‘Object’
  17. inject() must be called from an injection context
  18. Update parent component property from child component in Angular 2
  19. How to use variable to define templateUrl in Angular2
  20. Behaviour subject initial value null?
  21. Class is using Angular features but is not decorated. Please add an explicit Angular decorator
  22. How to validate white spaces/empty spaces? [Angular 2]
  23. How to run the Dist Folder on Local Machine in Angular 6+?
  24. How to delete a field in a Firestore Document?
  25. Angular2: use [(ngModel)] with [ngModelOptions]=”{standalone: true}” to link to a reference to model’s property
  26. How to manually set focus on mat-form-field in Angular 6
  27. What is the difference between fakeAsync and async in Angular testing?
  28. How to use angular 2 service with Ionic 2?
  29. Do I need to `complete()` takeUntil Subject inside ngOnDestroy?
  30. How to implement behavior subject using service in Angular 8

Leave a Comment