Je dois montrer une colonne lorsque l'utilisateur clique sur un bouton code> Modifier code>. La colonne affiche un symbole Supprimer dans la colonne "Actions". Je ne suis pas sûr de la façon de le faire. Si j'ajoute des "actions" dans html: strong> p> affichéeColumn code>, le bouton d'édition ne fonctionnera pas et il y a une erreur d'erreur indiquée plusieurs liaisons multiples. export class SubjectListComponent implements OnInit {
displayedColumns: string[] = ['Number', 'Subject_Code',
'Subject_Name', 'Actions'
];
showDetails: boolean;
constructor() {
this.showDetails = false;
}
toggleButton() {
this.showDetails = !this.showDetails;
}
}
3 Réponses :
Consultez
Sélection de la grille JavaScript p>
Vous pouvez soit obtenir la cellule focalisée en utilisant P>
var cellValue = gridOptions.api.getValue(colKey, row.node)
Attends je vais vérifier
Vous voulez ajouter au fichier .TS
Vous pouvez simplement afficher / masquer la colonne en ajoutant / en supprimant le nom de la colonne dans le tableau vérifier
Ce
Stackblitz. P>
blockQuote> Le changement principal serait dans la fonction AIMUNCOLUMUNS CODE> Array.
togglebutton code> (et supprimez la propriété showdétails code> Tout ensemble): p> toggleButton() {
let index = this.displayedColumns.indexOf('Actions');
if (index > -1) {
this.displayedColumns.splice(index, 1);
} else {
this.displayedColumns.push('Actions');
}
}
Qu'est-ce qui ne fonctionne pas? Des messages d'erreur? Comme vous pouvez le constater dans la Stackblitz, cela fonctionne bien, il doit toujours y avoir un problème dans votre code. Pouvez-vous montrer le code mis à jour?
J'ai besoin de la showdétails parce que j'ai besoin de la section d'édition pour apparaître
Non tu ne le fais pas. Comme vous pouvez le constater dans la Stackblitz, des poignées de matériau angulaire qui pour vous. Il affiche exactement les colonnes que vous passez à la table dans affichée des columns . En modifiant ce tableau de noms de colonne, vous pouvez facilement afficher et masquer des colonnes.
Mais je n'ai pas symbole dans const element_data. Je n'ai utilisé aucun élément_data que la table reçoit ses données de la base de données.
Cela n'a pas d'importance. Je viens d'utiliser un exemple de matériau angulaire pour montrer comment cela fonctionne. Pour vous, vous devez ajouter / supprimer 'actions' sur affichésColumns . Lorsque les données proviennent peu d'importance car nous modifions simplement la structure de la table. EDIT: J'ai mis à jour la fonction dans la réponse afin que cela fonctionne pour vous.
Est-ce que je reste toujours * ngif = "showdétails"
Non, retirez le NGIF
Merci beaucoup. Merci pour l'effort.
Vous pouvez soit obtenir la cellule ciblée en utilisant
var cellValue = gridOptions.api.getValue(colKey, row.node)
Vous pouvez obtenir une ligne complète
Je veux que la colonne "Actions" n'apparaît que lorsque l'utilisateur clique sur le bouton "Modifier"