diff --git a/packages/sdks/overrides/angular/src/components/dynamic-div.ts b/packages/sdks/overrides/angular/src/components/dynamic-div.ts
index 62f658a34e8..e7edbcc216d 100644
--- a/packages/sdks/overrides/angular/src/components/dynamic-div.ts
+++ b/packages/sdks/overrides/angular/src/components/dynamic-div.ts
@@ -22,6 +22,10 @@ import { CommonModule } from '@angular/common';
`,
standalone: true,
imports: [CommonModule],
+ styles: [
+ ':host { display: contents; }',
+ '.props-blocks-wrapper { display: flex; flex-direction: column; align-items: stretch; }',
+ ],
})
export default class DynamicDiv {
@Input() attributes: any;
diff --git a/packages/sdks/overrides/angular/src/components/dynamic-renderer/dynamic-renderer.ts b/packages/sdks/overrides/angular/src/components/dynamic-renderer/dynamic-renderer.ts
index 6f607b4f66f..de00e0b2461 100644
--- a/packages/sdks/overrides/angular/src/components/dynamic-renderer/dynamic-renderer.ts
+++ b/packages/sdks/overrides/angular/src/components/dynamic-renderer/dynamic-renderer.ts
@@ -65,6 +65,7 @@ import { isEmptyElement } from './dynamic-renderer.helpers';
`,
standalone: true,
imports: [CommonModule],
+ styles: [':host { display: contents; }'],
})
export default class DynamicRenderer {
isEmptyElement = isEmptyElement;
@@ -114,6 +115,7 @@ export default class DynamicRenderer {
selector: 'dynamic-image, DynamicImage',
template: ` `,
standalone: true,
+ styles: [':host { display: contents; }'],
})
export class DynamicImage {
@Input() attributes!: any;
@@ -123,9 +125,9 @@ export class DynamicImage {
constructor(private renderer: Renderer2) {}
- ngAfterViewInit() {
- const el = this.v.nativeElement;
- if (this.attributes) {
+ ngOnChanges() {
+ const el = this.v && this.v.nativeElement;
+ if (el && this.attributes) {
Object.keys(this.attributes).forEach((key) => {
this.renderer.setAttribute(el, key, this.attributes[key] ?? '');
});
@@ -137,6 +139,7 @@ export class DynamicImage {
selector: 'dynamic-button, DynamicButton',
template: ` `,
standalone: true,
+ styles: [':host { display: contents; }'],
})
export class DynamicButton {
@Input() attributes!: any;
@@ -146,9 +149,9 @@ export class DynamicButton {
constructor(private renderer: Renderer2) {}
- ngAfterViewInit() {
- const el = this.v.nativeElement;
- if (this.attributes) {
+ ngOnChanges() {
+ const el = this.v && this.v.nativeElement;
+ if (el && this.attributes) {
Object.keys(this.attributes).forEach((key) => {
this.renderer.setAttribute(el, key, this.attributes[key] ?? '');
});
@@ -160,6 +163,7 @@ export class DynamicButton {
selector: 'dynamic-link, DynamicLink',
template: ` `,
standalone: true,
+ styles: [':host { display: contents; }'],
})
export class DynamicLink {
@Input() attributes!: any;
@@ -169,9 +173,9 @@ export class DynamicLink {
constructor(private renderer: Renderer2) {}
- ngAfterViewInit() {
- const el = this.v.nativeElement;
- if (this.attributes) {
+ ngOnChanges() {
+ const el = this.v && this.v.nativeElement;
+ if (el && this.attributes) {
Object.keys(this.attributes).forEach((key) => {
this.renderer.setAttribute(el, key, this.attributes[key] ?? '');
});