Set property on controller from within a component


#1

Is there a way to set a property on a parent controller from inside a component?

I have a component that acts as a file input, when the user added a new image there is some code that runs to read the dataUrl of that image and sets a property to the dataUrl. When I add an image tag in the components handlebars template it works fine, but if I add an image tag and set the source to the same property in the index handlebars template it doesn’t work.

I’m assuming this means that the property is being set in that view and not on the controller.

I’ve tried setting it by typing this.set('controller.image',image.imageUrl); but this doesn’t seem to be working either.


#2

I’m not sure I understand your setup but if you want to get info from a component to a controller, sendAction is the preferred method. There are also some hacky ways to get access to parents from a component such as nearestWithProperty and nearestOfType.


#3

So I told the component to send action to an action name I created in the actions hash on the index controller but it’s not being fired.

Component

self.sendAction('setImage', fileInfo);

Index Controller

setImage: function(file) {
	console.log('set image');
	this.set('image',file.dataUrl);
},

The console log statement isn’t being fired so I can see it’s not being called here.


#4

Messing around with some things I got this working, I think it was the way my app was setup.

Along these lines though, now I have a component that has a button with an action attached to it, this action fires in the components class file, but after that I want it to send an action to the controller passing along some data it created, but using the send action from this action inside the component is not calling the action on the controller again.


#5

What does your index template look like? You have to {{my-comp actionNameInComponent=actionNameInController }} in order for the action handler in the controller to be called.


#6

I have set it up like you suggested in your recent reply, and I’m still not getting it to work, I have created a new stack overflow question here, if you could take a look at it I would be greatful! :grin:


#7

Just updated the post, I figured it out after some more reading, I noticed I didn’t have “” around the action name in the component call in the handlebars template, I updated the stack overflow.

Thank you for helping me get here though!