android - save bookmark or favorite item in ionic framework when i close app -
i have item-list , mark of them . when close app , open aggain , marks removed . please me save , load app
list.html
<ion-view class="text-center bfont" view-title="کافی شاپ"> <ion-nav-buttons side="left"> <button class="button button-icon ion-help-circled" ng-click="openmodal()"></button> </ion-nav-buttons> <ion-nav-buttons side="right"> <button class="button button-icon ion-gear-a" ng-click()="openmodal()"></button> </ion-nav-buttons> <div class="bar bar-subheader item-input-inset bar-light"> <label class="item-input-wrapper"> <i class="icon ion-search placeholder-icon"></i> <input type="search" class="text-right" ng-model="query" placeholder="جست و جو"> </label> </div> <ion-content class="has-subheader"> <ion-list> <ion-item ng-class="{'star':item.star}" ng-repeat='item in artists | filter: query' class="item-thumbnail-right item-icon-left item-text-wrap" href="#/tab/list/{{item.shortname}}"> <img ng-src="img/img/{{item.shortname}}.jpg" alt="{{item.name}} photo"> <h3 class="text-right bfont">{{item.name}}</h3> <p class="bfont" style="direction:rtl; text-align:justify">{{item.shortbio | limitto: 100}} {{ item.shortbio.length > 150 ? '…' : '' }}</p> <button class="button button-clear icon ion-star button-assertive" ng-click="togglestar(item)" ng-show="item.star"></button> <ion-option-button class="button-assertive" ng-click="togglestar(item)"> <i class="icon ion-star"></i> </ion-option-button> </ion-item> </ion-list> </ion-content> </ion-view> app.js
// ionic starter app // angular.module global place creating, registering , retrieving angular modules // 'starter' name of angular module example (also set in <body> attribute in index.html) // 2nd parameter array of 'requires' angular.module('starter', ['ionic']) .run(function($ionicplatform) { $ionicplatform.ready(function() { // hide accessory bar default (remove show accessory bar above keyboard // form inputs) if(window.cordova && window.cordova.plugins.keyboard) { cordova.plugins.keyboard.hidekeyboardaccessorybar(true); } if(window.statusbar) { statusbar.styledefault(); } }); }) .config(function($stateprovider, $urlrouterprovider, $ionicconfigprovider) { $ionicconfigprovider.tabs.position('bottom'); $stateprovider .state('tabs', { url: '/tab', abstract: true, templateurl: 'templates/tabs.html' }) .state('tabs.home', { url: '/home', views: { 'home-tab': { templateurl: 'templates/home.html' } } }) .state('tabs.list', { url: '/list', views: { 'list-tab': { templateurl: 'templates/list.html', controller: 'listcontroller' } } }) .state('tabs.detail', { url: '/list/:aid', views: { 'list-tab': { templateurl: 'templates/detail.html', controller: 'listcontroller' } } }) $urlrouterprovider.otherwise('tab/home'); }) .controller('appctrl', function($scope, $ionicmodal) { $ionicmodal.fromtemplateurl('templates/help.html', { scope: $scope, animation: 'slide-in-up' }).then(function(modal) { $scope.modal = modal; }); $scope.openmodal = function() { $scope.modal.show(); }; $scope.closemodal = function() { $scope.modal.hide(); }; }) .controller('listcontroller', ['$scope', '$http', '$state', function($scope, $http, $state) { $http.get('js/data.json').success(function(data){ $scope.artists = data; $scope.whichartist = $state.params.aid; $scope.togglestar = function(item) { item.star = !item.star; } }); }]); index.html
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> <title></title> <link href="lib/ionic/css/ionic.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <link href="css/font.css" rel="stylesheet"> <!-- if using sass (run gulp sass first), uncomment below , remove css includes above <link href="css/ionic.app.css" rel="stylesheet"> --> <!-- ionic/angularjs js --> <script src="lib/ionic/js/ionic.bundle.js"></script> <!-- cordova script (this 404 during development) --> <script src="cordova.js"></script> <!-- app's js --> <script src="js/app.js"></script> </head> <body ng-app="starter" ng-controller="appctrl"> <ion-nav-bar class="bar-energized bfont"> <ion-nav-back-button class="bfont">بازگشت </ion-nav-back-button> </ion-nav-bar> <ion-nav-view></ion-nav-view> </body> </html> tabs.html
<ion-tabs class="tabs-icon-top tabs-energized bfont"> <ion-tab title="خانه" icon="ion-home" href="#/tab/home"> <ion-nav-view name="home-tab"></ion-nav-view> </ion-tab> <ion-tab class="text-center" title="کافی شاپ" icon="ion-coffee" href="#/tab/list"> <ion-nav-view name="list-tab"></ion-nav-view> </ion-tab> </ion-tabs> i mark item , when close app item unmarked , item in json file please me save marks .
Comments
Post a Comment