DEV Community

Discussion on: Passing data between nested components with Angular

Collapse
 
chiangs profile image
Stephen Chiang

Hi Daniel without seeing all of your code I'm not exactly sure what you're trying to do. But I'm assuming you are trying to pass the path to the image as a string? Be sure to pass an absolute path rather than relative.

If it's undefined perhaps the variable is not yet defined or the input is not yet provided at the time when the console log is called.

Collapse
 
danielfrugoni profile image
DanielFrugoni

Hi Stephe !

In my form i Hava this:
(use this img temp so just to check my image is there)

I use the just to see that the info is there.
then I call <upload-image...., with the parameter that you see.
But when I get into :

@Component({
selector: 'upload-imagen',
templateUrl: './imagen.component.html',
styleUrls: ['./imagen.component.scss'],

})

export class imageUploadComponent {
@Input() imagen: any;
....
and do a console.log(this.imagen) can see :undefined
So I guess Im not passing the parameter ok or Im not using (@Input() imagen: any;) the correct way.

Hope you undertand me and thx for your time

Thread Thread
 
chiangs profile image
Stephen Chiang

Hi I can't really debug for you from here... But have you imported input?

Thread Thread
 
danielfrugoni profile image
DanielFrugoni

@Component({
selector: 'upload-imagen', ....

and ...
export class imageUploadComponent {
@Input() imagen: any;

Could it be that passing parameter has a size limit ?

Thx

Thread Thread
 
danielfrugoni profile image
DanielFrugoni

yes

Collapse
 
danielfrugoni profile image
DanielFrugoni

Hi

No the path, the image I have in a json file

Thread Thread
 
chiangs profile image
Stephen Chiang

So if you've imported input like this:

import { component, input} from `@angular/core`

What does your HTML markup look like?

Thread Thread
 
danielfrugoni profile image
DanielFrugoni

Since I cant find the solution, Im trying to assign the Image to a global variable and then assign it to a local var

Thread Thread
 
danielfrugoni profile image
DanielFrugoni

Yes
@import() miImage: any;

Thread Thread
 
danielfrugoni profile image
DanielFrugoni

Im trying something differet like this

@Injectable()
export class Globals {
public imagenUno: any;
}

then:
this.globals.imagenUno=data.Imagen;
console.log('Foto:'+this.globals.imagenUno) (I see the image in conole.log)

then I have image.componet.ts
import { Globals } from 'src/app/globals';

constructor(private globals: Globals ) {
console.log('Foto:'+this.globals.imagenUno) (get Foto:undefined)
}

Well I guess Im missing something with angular 7

Collapse
 
danielfrugoni profile image
DanielFrugoni

Hi Stephe !

In my form i Hava this:





I use the just to see that the info is there.
then I call <upload-image...., with the parameter that you see.
But when I get into :

@Component({
selector: 'upload-imagen',
templateUrl: './imagen.component.html',
styleUrls: ['./imagen.component.scss'],

})

export class imageUploadComponent {
@Input() imagen: any;
....
and do a console.log(this.imagen) can see :undefined
So I guess Im not passing the parameter ok or Im not using (@Input() imagen: any;) the correct way.

Hope you undertand me and thx for your time