๐Ÿ“ฆ ionic-team / ionic-ion-swipe-cards

Swipeable card based layout for Ionic and Angular

โ˜… 353 stars โ‘‚ 130 forks ๐Ÿ‘ 353 watching โš–๏ธ MIT License
๐Ÿ“ฅ Clone https://github.com/ionic-team/ionic-ion-swipe-cards.git
HTTPS git clone https://github.com/ionic-team/ionic-ion-swipe-cards.git
SSH git clone git@github.com:ionic-team/ionic-ion-swipe-cards.git
CLI gh repo clone ionic-team/ionic-ion-swipe-cards
Loading files...
๐Ÿ“„ README.md

Ionic Contrib: Swipeable Cards ===================

Swipeable card based layout for Ionic and Angular. As seen in apps like Jelly

Demo

Usage

Include ionic.swipecards.js after the rest of your Ionic and Angular includes. Then use the following AngularJS directives:

<swipe-cards>
  <swipe-card ng-repeat="card in cards" on-destroy="cardDestroyed($index)" on-card-swipe="cardSwiped($index)">
    Card content here
  </swipe-card>
</swipe-cards>

To add new cards dynamically, just add them to the cards array:

$scope.cards = [
  { // card 1 },
  { // card 2 }
];

$scope.cardDestroyed = function(index) {
  $scope.cards.splice(index, 1);
};

$scope.cardSwiped = function(index) {
  var newCard = // new card data
  $scope.cards.push(newCard);
};