From my previous post, you can enable the twig debug function in your Drupal site setup, but you should know about the renderable associative array structure. Then only you able to get the value, kint() function would be the best way to get the data in module and template file.
When we use kint function:
Drupal architecture has business logic as a module layer and Presentation logic as a theme layer. So sometimes developers need to process something after / before render the value in module layer or theme layer. Here in Drupal, the result set will be rendered in the front end as a renderable associate array. For example, you are having one node that contains “Hello World” whether it can be default page or article content type. As an end user you will see only “Hello World” content when you navigating [http://drupalsite/node/1], but internally the data will pass it from the node module then all the content will be passed to the theme layer so that end user will see an elegant output. Look at the below image this will tell you clearly how the Drupal data processed to the end user.
How to use Kint() Function:
So from the above image, you will get to know the data flow, how the page presented to the end user. So when you create one node content it will be passed via default theme implementation along with CSS styles. Suppose if you want to alter the render array means, you can do it in the module layer (i.e .module (or) .php file). Else if you want to override the default theme implementation means you can do it in a theme layer (i.e twig file).
In our case take an example we want to override the presentation layer. So I need to get the data from the theme layer then only I can change the rendering the HTML. I have enabled the twig debug function, so based on that I picked one twig file there I passed content variable inside the kint function then I navigated to the corresponding node page in the browser so that I will get the response which depicts in the below image.
*Note Please refer the previous post to know how to use kint in detail.
Thorugh KINT()
So through kint I am getting the renderable associative array for the corresponding node content.
Say for example from the above image, I want to pick all the content. Consider from the above result set from the kint result I want to build one table format and return to the theme layer so that end user will see a table information. Please look at the below snippet will be in the corresponding twig file.
|
1
2
3
|
<tr><td{{ item.attributes.addClass('field--item') }}>{{ item.content['#items'][0]['question'] }}</td><td{{ item.attributes.addClass('field--item') }}>{{ item.content['#items'][0]['answer'] }}</td></tr> |
The above code snippet will return the value like below output.
| Your use of this website | You are free to access and print the information on this website |
Like wise, you can debug your module generated output also. Let me know your thoughts and queries about this topic in the comments.
