I tried copying the project but it doesn't work? Am I missing any package? Or is it because my angular version is not suitable? Angular version 14.Help me. Thank you!
Hi Nguyen,
Looking at the code-snippet from the screenshot, what I can say is that the result look is just how the grid is configured and not really an issue, or should not be related to the type of displayDensity set either. Please, note that for this thrid field, there are two parent column groups defined and the child column – that is the third level, has its header property set to an empty string – “ “.
Having in mind that this setup is entirely expected to look in this way, I am wondering if this is defined like this on purpose, or if your requirement involves something different? If you were to share more details about it, maybe we could provide further suggestions on how to achieve it.
Additionally, please, refer to the topic about the Grid Multi-column Headers here for more information on this feature.
Best regards, Bozhidara Pachilova
Thanks for the above suggestion.But I have problems when using [displayDensity]="'cosy'".When I use igx-column-group external clamp for igx-column tag.The height of the cell in the red circle is higher than the other cells.I check the css but I don't know the cause. Is there any way to solve this problem?Our project is running and I cannot upgrade the version because it could have a big impact on the project.
Hello Nguyen,
Could you please, provide more context about what is not working? For example, are there any errors in the console?
Having only this information, what I can say is that it is true that version 14 of Angular and Ignite UI for Angular are no longer supported. We usually advise to upgrade to the latest or at least the supported versions (16.1.x, 17.2.x and soon - 18.0.x (currently in available in a beta release)) in order to leverage all introduced features and fixes since earlier versions like 14.
If the “copied” project you are referring to is any of our samples, which are implemented against the latest version, having in mind that this is a three-versions gap, it is possible that there have been breaking changes that may cause errors on your side.
Among some resources you might find useful is our Update Guide, where you can find a detailed list of the breaking changes along with code-snippets introduced between each major and minor versions. You could refer to this list in case any of the components you are using is affected by such changes. If you were to share the errors you are getting, we could assist you to locate them as well.
As you have mentioned sizing, what I can say is that the approach in the sample you might have copied from was introduced in version 16 - more details here, which would explain why it is currently not working for you. Before, this used to be achieved via the DisplayDensityToken feature and not through CSS variables.
One had to set the displayDensity property of the grid like below:
[displayDensity]="'compact'"
Where the available options were `comfortable`, `cosy`, `compact`.
Another useful link would be the API pages, for example this is the IgxGridComponent API. In the black navbar in the upper part of the screen, there is a dropdown from which earlier versions can be selected, so you can refer to the exposed API back then. For instance this is the API page for v 14.2.x and here is a link to the deprecated displayDensity property of the grid.
Let me know if I can assist you with anything else on the matter. Looking forward to hearing from you.
Best regards,Bozhidara PachilovaSoftware Developer