Lightning コンポーネント開発者ガイド
jマークアップの動的な表示または非表示
マークアップの表示を切り替えるときは CSS を使用します。<aura:if> タグを使用することもできますが、より標準的なアプローチである CSS の使用をお勧めします。
次の例では、$A.util.toggleClass(cmp, 'class') を使用してマークアップの表示を切り替えます。
1<!--c:toggleCss-->
2<aura:component>
3 <ui:button label="Toggle" press="{!c.toggle}"/>
4 <p aura:id="text">Now you see me</p>
5</aura:component>1/*toggleCssController.js*/
2({
3 toggle : function(component, event, helper) {
4 var toggleText = component.find("text");
5 $A.util.toggleClass(toggleText, "toggle");
6 }
7})1/*toggleCss.css*/
2.THIS.toggle {
3 display: none;
4}[切り替え] ボタンをクリックすると、CSS クラスが切り替えられ、テキストが表示または非表示になります。