Ich erstelle eine Master-Detail-Tabelle. Bevor ein Artikel ausgewählt wurde, sollten die Details nicht sichtbar sein und nur beim Klicken auf einen Artikel sichtbar sein.ember bind-attr-Klasse wird nicht vom Controller festgelegt
Der Grund, warum ich eine Klasse verwende, liegt darin, dass die Tabelle normalerweise 100% breit ist und ihre Größe ändert, wenn das Detail angezeigt wird. Dies ist noch nicht implementiert. Gerade jetzt, ich will nur die ‚mit Details‘ Klasse in die div eingefügt werden, wenn ich in der < li klicken>
Hier ist eine grobe twiddle: https://ember-twiddle.com/f35bb4b593394d955460a83a10f092a4
In meiner Vorlage, die < li > hat eine Aktion:
<li {{action 'showDetails'}}>
, die die Aktion in meinem showdetails Controller feuert (ich weiß, dass es wegen der :) in Konsole Brennen):
withDetails: false,
actions: {
showDetails: function() {
console.log(":)");
this.set('withDetails', true);
}
}
, die die mit Detail Klasse meine Details div hinzufügen sollte:
<div {{bind-attr class=":game-details withDetails"}} >
die mein CSS entsprechen sollte:
.game-details {
display: none;
border: 1px solid red;
}
.game-details.with-details {
display: block;
border: 1px solid green;
}
Es sollte so einfach sein. Was vermisse ich?
[EDIT] ich gerade gelernt, diesen Trick:
Falsch:
<div class="game-details" {{bind-attr class="withDetails"}}>
Rechts:
<div {{bind-attr class=":game-details withDetails"}}>
die die div zeigt, aber befestigen nicht ein mit Details Klasse kann ich zielen.
@TameBurger: Stattdessen sollten Sie
{{if}}
in Ihrer Klasse Attribute, wie so verwenden eingebettet dies baut auf Ihren Spielen von diesem Posten twiddle: http://stackoverflow.com/questions/36898364/ ember-model-making-a-tabelle-of-items-click-for-detail – DaveC426913Wo finden Sie die Informationen, die Sie brauchen, um 'bind-attr' zu verwenden? Ich bin nur neugierig, ob wir die Ember-Dokumentation verbessern können. –