Вызов действия контроллера из действия в компоненте

Question

У меня возникли проблемы с тем, чтобы это работало. Я думал, что сделал это правильно, но, похоже, это не так.

index.hbs

{{#if image}} 
    {{image-cropper imageToCrop=image setCroppedImage=setCroppedImage}} 
    <br> 
    {{/if}} 
{{file-input action="setImage"}} 

Файл-компонент ввода принимает изображение в, и устанавливает свойство изображения в URL данных, который затем вызывает образ-кадрирования компонент, чтобы показать.

имидж-cropper.hbs

<div class="cropper-container"> 
    <img src="{{imageToCrop}}"> 
</div> 
<button {{action 'cropImage'}}>Crop Image</button> 
{{croppedImage}} 

Когда я нажимаю на кнопку вызывается cropImage действие в файле изображения-cropper.js

изображения cropper.js

actions: { 
    cropImage: function() { 
     var container = this.$(this.get('cropperContainer')); 
     var croppedImage = container.cropper('getCroppedCanvas'); 
     this.sendAction('setCroppedImage', croppedImage); 
    } 
} 

Поэтому я использую this.sendAction();, чтобы позвонить setCroppedImage имя действия на компонент, который ссылается на имя действия на компоненте в файле index.hbs, который я думал, должен назвать имя действия на контроллере слева от знака =

index.js (контроллер)

setCroppedImage: function(croppedImage) { 
    console.log('set cropped image called on index controller'); 
    this.set('finalCroppedImage', croppedImage); 
}, 

Но console.log утверждение не вызывается, так что я знаю, что действие контроллера не вызывается либо.

Мне нужна помощь, чтобы понять, как заставить это работать здесь.

Answer 1

После дополнительного чтения я вижу, что мне нужно добавить "" с именем действия, как так

От

{{image-cropper imageToCrop=image setCroppedImage=setCroppedImage}} 

Для

{{image-cropper imageToCrop=image setCroppedImage="setCroppedImage"}}