web-dev-qa-db-fra.com

Drupal 8 bloc personnalisé avec html et javascript

Dans Drupal 8 quel est le processus pour créer des blocs avec html et javascript?

Voici mon exemple de code pour créer le bloc

class TopNewsBlock extends BlockBase {

  /**
   * {@inheritdoc}
   */
  public function build() {
     //Fetch data
     return array(
      'type' => 'markup',
      '#markup' => '<table id="example_table"></table>',
      '#attached' => array(
        'library' =>  array(      
          'custom_cms_blocks/dataTables.dataTablesjs',
          'custom_cms_blocks/top-news-library'
        ),
      ),
     ); 
  } 

}

Cela fonctionne mais le problème que j'ai est - je veux séparer le code html du code php. Est-il possible d'inclure un fichier html dans le bloc, tout comme la façon dont un fichier javascript est attaché en tant que bibliothèque?

blocks8
4
Bhuvana

Vous devez utiliser hook_theme() dans votre module et déclarer un nouveau modèle Twig que vous souhaitez utiliser pour votre bloc.

Voici un exemple qui doit aller à YOUR_MODULE.module fichier:

function YOUR_MODULE_theme() {
  return [
    'YOUR_TEMPLATE_KEY' => [
      // Here you can pass any variables you want, if necessary.
      'variables' => ['var1' => NULL],
    ],
  ];
}

Créez ensuite un dossier appelé /templates dans votre module personnalisé et YOUR_TEMPLATE_KEY.html.twig fichier où vous pouvez avoir le balisage souhaité. Voir ci-dessous comment utiliser les variables que vous transmettez au modèle:

<div id="your-block">
  {{ var1 }}
</div>

Enfin, pour l'utiliser:

public function build() {
  return [
    '#theme' => 'YOUR_TEMPLATE_KEY',
    '#var1' => 'Variable one passed here',
  ];
}

J'espère que cela t'aides.

15
Aram Boyajyan