CODEWITHSUNDEEP
angulartypescriptangular6
realist
realist

Reputation: 2385

Writing style in directive in angular

I'm using angular 6 with PrimeNg. And it's dialog component contentStyle property. If, I write in my html like below, it is working perfectly. But, when I write in my directive (for setting default values of components), its style corrupting. What can be the mistake?

This working perfectly.

<p-dialog [contentStyle]="{'overflow':'visible'}"></p-dialog>

But when I write like below, its style corrupting.

export class DialogDirective {
  constructor(dialog: Dialog) {
    dialog.responsive = true;
    dialog.modal = true;
    dialog.closeOnEscape = false;
    dialog.contentStyle = "{'overflow':'visible'}";
  }
}

<p-dialog></p-dialog>

You can see PrimeNg's dialog from this link

Upvotes: 0

Views: 216

Answers (1)

rijin
rijin

Reputation: 1757

As you are using property, you should pass object into it not string.

export class DialogDirective {
  constructor(dialog: Dialog) {
    dialog.responsive = true;
    dialog.modal = true;
    dialog.closeOnEscape = false;
    dialog.contentStyle = {'overflow':'visible'}; <-- here
  }
}


<p-dialog [contentStyle]="dialog.contentStyle"></p-dialog>

Upvotes: 1

Related Questions