리오집사의 기억저장소

ionic에서 div 속성을 숨기거나 보이게 하기 위해서는 ng-show 속성을 이용하면 된다.

원문 내용 : https://forum.ionicframework.com/t/solved-how-to-hide-a-div-by-clicking-a-button/9422/7


코드를 보면, ng-show 속성을 controller에서 버튼 클릭시에 true나 false로 바꿈으로서 item을 보이게 하거나 숨기고 있는 걸 알 수 있다.

index.html

<div class="list card" id="startCard" ng-show="showstartCard">
    <div class="item item-image item item-text-wrap">
              Card 1
    </div>
</div>
<div class="list card" id="secondCard" ng-show="showsecondCard">
    <div class="item item-image item item-text-wrap">
              Card 2
    </div>
</div>

<button ng-click="hideCard()" class="button button-full button-calm button icon-right ion-chevron-right">
    Start now
</button>


controllers.js

.controller("StartpageCtrl", function($scope){
    $scope.showstartCard = true;
    $scope.showsecondCard = false;

    $scope.hideCard = function() {
        $scope.showstartCard = false;
        $scope.showsecondCard = true;
    };
});


반응형

공유하기

facebook twitter kakaoTalk kakaostory naver band