Is there a way to dynamically set y attribute for an image element inside svg element?

Question

As stated in the question, I wonder if there is a way to set y attribute for an image element inside svg, because everytime user provides different image, I need to change image's “y” attribute value. Right now when I try to use binding in Angular, I get the following error:

My code for embedding image inside svg looks like this:

            <svg class="conversation-image-preview">
              <image *ngIf="inConversationIconInfo.previewUrl" 
              [attr.href]="inConversationIconInfo.previewUrl" 
              [y]="inConvImageY" 
                 />
            </svg>

I'd really appreciate any help.

Answer 1

The JavaScript strict mode-only exception "setting getter-only property" occurs when there is an attempt to set a new value to a property for which only a getter is specified.

In your case SVGImageElement is only having getter element, and when you trying to attempt set value it throwing error in console.

You can see in document of SVGImageElement where y attribute is read only .