Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
215
Dynamic Row Height with text wrapping
posted

I am trying to handle some columns which can have large amounts of data. What I would like is to be able to have the row get bigger so that all the data could display in the column with wrapping the text. Since some rows might have less data compared to others I would like to be able to set the row height dynamically or have it scale automatically depending upon the content. I don't think this is currently possible since the rowHeight seems to just be a property at grid level. Is there a way to achieve that?

Alternatively what I tried was using the multi-row layout so that the items with larger data could span the whole grid width. However if I set the column to span multiple rows then it still just shows one line of text in the center. I tried adding styling to it so that it would wrap the text in that space but I can't make that work. Is it possible to have the text use the multiple lines of the layout? I have applied cellClasses to the column which spans multiple rows and am using following styling 

:host::ng-deep {
    .text-show-all {
        white-spacenormal;
        line-height1.4;
        word-wrapbreak-word;
        background-colorred;
    }
}
Background is coming red as expected so my styling is definitely applied but it is still not word wrapping the text at all. How can I make that work?