Je suis en train de créer un contrôle de tableau personnalisé qui sera réutilisable dans tout le projet. Je veux que ce tableau utilise MatSort
en interne. Il doit également être flexible, c'est pourquoi j'utilise des modèles pour l'en-tête et le corps du texte.
Le problème est que je ne peux pas spécifier mat-sort-header
sur un <th>
à l'intérieur d'un modèle. Dans mon projet, cela ne fonctionne pas (la directive est ignorée). J'ai créé un stackblitz simplifié et là, la console affiche une erreur : MatSortHeader must be placed within a parent element with the MatSort directive
.
J'y ai mis le minimum de code pour montrer le problème. Ce que je veux obtenir est quelque chose comme ceci :
<my-templated-table>
<ng-template #header>
<tr>
<th mat-sort-header="sortable">Sortable</th>
</tr>
</ng-template>
</my-templated-table>
Idéalement, j'aimerais même avoir une directive personnalisée pour l'en-tête de tri afin de pouvoir masquer MatSort
syntaxe du consommateur.
J'ai essayé de trouver une solution pendant quelques heures maintenant et chaque fois que je trouve quelque chose d'assez similaire, il n'y a pas de réponse. J'ai également lu qu'une directive ne peut pas ajouter une autre directive au moment de l'exécution, donc je ne sais pas si mon approche idéale est possible. Bien que je se sentir que les deux devraient être...