EdsonF / ionic-ion-swipe-cards

Swipeable card based layout for Ionic and Angular

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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);
};

About

Swipeable card based layout for Ionic and Angular

License:MIT License


Languages

Language:JavaScript 83.0%Language:CSS 15.8%Language:Objective-C 0.5%Language:Java 0.3%Language:C++ 0.2%Language:C# 0.2%