在 drupal 8 块中显示 html table

Show html table in drupal 8 block

我在 Drupal 8 中创建了一个模块,用于显示块中的第三方 API 数据

这是从 API

返回的一些数据
{"ObjectId":43,"ObjectName":"MEGA MELA","ObjectTitle":"Event Created by API","ObjectDescription":"NEW EVENT BY API","ObjectLabel":"","ObjectTypeId":33,"MaxFieldsExpected":5,"ObjectValueType":null,"ObjectControlType":"","IsDeleted":true,"CreatedDate":"2019-05-22T07:56:03.767","CreatedBy":null,"EditedDate":null,"EditedBy":null,"DeletedDate":null},{"ObjectId":44,"ObjectName":"Event x11","ObjectTitle":"Event Created by API","ObjectDescription":"NEW EVENT BY API","ObjectLabel":"","ObjectTypeId":33,"MaxFieldsExpected":5,"ObjectValueType":null,"ObjectControlType":"","IsDeleted":true,"CreatedDate":"2019-05-23T00:33:50.7","CreatedBy":null,"EditedDate":null,"EditedBy":null,"DeletedDate":null}]} 

我已经创建了一个自定义模块来在一个块中显示其中的一些数据

这是我的模块目录层次结构,模块目录名称是 apihtml

 -apihtml 
    -src
      -Plugin
        -Block
          -rest.php   

    -apihtml.info.yml

如您所见,只有两个文件 apihtml.info.ymlrest.php

这里是apihtml.info.yml内容

 name: Third Party Api Data with html
    type: module
    description: 'This is for showing rest data in ui with html'
    package: Custom
    version: 8.x
    core: 8.x
    dependencies:
      - node
      - block

这里是rest.php内容

   <?php

/**
 * @file
 */
namespace Drupal\apihtml\Plugin\Block;
use Drupal\Core\Access\AccessResult;

use Drupal\Core\Block\BlockBase;
use Drupal\Component\Serialization\Json;

/**
 * Creates a 'Foobar' Block
 * @Block(
 * id = "AntShow with html formatting",
 * admin_label = @Translation("Ant Show & HTML"),
 * )
 */
class rest extends BlockBase {
 public function build() {
    /** @var \GuzzleHttp\Client $client */
    $client = \Drupal::service('http_client_factory')->fromOptions([
      'base_uri' => 'http://myApiPath',
    ]);



       $response = $client->get('objects/events');


    $dec = Json::decode($response->getBody());



    $items = [];


foreach ($dec as $d) {
    foreach ($d as $ins) {  
  $items[] = $ins['ObjectName'] ;

    }
}


         return [
      '#theme' => 'item_list',
      '#items' => $items,

    ];

  }
}

这里通过使用 array Key ObjecName 我可以在块中显示对象名称

这是块 OutPut

MEGA MELA
事件 x11

但我想要更多
我想以表格形式显示此 API 返回的数据意味着 array key 应该是 data 值数据的 header 将在 rows

像这样

   ObjectId  | ObjectName | ObjectTitle           | ObjectDescription | ObjectLabel | ObjectTypeId | MaxFieldsExpected | ObjectValueType | ObjectControlType | IsDeleted | CreatedDate | CreatedBy | EditedDate |  EditedBy
    43        |  MEGA MELA |  Event Created by API | NEW EVENT BY API | ..............................................................................

在这个 Drupal 块中,所有显示的数据都必须在 rest.php 文件

build 函数中返回

这是以表格格式

显示 api 返回数据的代码
     foreach ($dec as $d) {
  ?>
    <table>
<?php foreach ($d as $ins) { ?>
<tr>
<?php
 foreach ($ins as $key=>$value) {  
   echo "<td><h3>".$key."</h3></td>";
 } ?>
</tr>
<tr>
<?php
 foreach ($ins as $key=>$value) {  
   echo "<td><h3>".$value."</h3></td>";
 } ?>
</tr><?php
} ?>
</table> <?php
}

但我不知道如何将此代码放入 rest.phpbuild function 中以在 block

中显示表格数据

您可以创建自定义 Twig 模板并根据需要显示所有数据。您可以阅读更多相关信息 here

使用自定义模板: 1.改变你 return :

return [
      '#theme' => 'item_list',
      '#items' => $items,

    ];

return [
        '#theme' => 'my_custom_template',
        '#content' => $items,
      ];

在你的apihtml.module我们hook_theme

function  apihtml_theme() {
    return array(
      'my_custom_template' =>[
        'variables' => [
          'content' => []
        ]
      ]);
}

并创建自定义树枝:templates/my-custom-template.html.twig

{% for data in content %}
...
{% endfor %}