@peterokachie wrote:
Good day all,
I have few questions, I bought a magento ionic app that sync my magento ecommerce site with the app. However, I have some issues with the customization. The app is very basic.
Question 1: I have created a nested tab with 3 nav (Home, wishlist, Login) but I am having issues link each tab to the template file. They all have their files in the www folder. How can I acheive this?
Here is the code for the home page:
<ion-view view-title="Quickkbuy"> <div class="tabs-striped tabs-top tabs-background-positive tabs-color-light"> <div class="tabs"> <a class="tab-item active" href="#"> <i class="icon ion-home"></i> Home </a> <a class="tab-item" href="#"> <i class="icon ion-heart"></i> Wishlist </a> <a class="tab-item" href="#"> <i class="icon ion-gear-a"></i> Login </a> </div> </div> <ion-content> <ion-slide-box delegate-handle="image-viewer" auto-play="true" does-continue="true"> <ion-slide style="line-height: 0px" ng-repeat="item in banners.home_banners.item"> <img style="width: 100%" src="{{item.image.__text}}"> </ion-slide> </ion-slide-box> <ion-list> <ion-item class="item-royal" ng-if="categories.category.items"> <strong>Categories</strong> </ion-item> <ion-item ng-repeat="item in categories.category.items.item" ng-click="maincategory(item.entity_id)"> {{ item.label }} </ion-item> </ion-list> </ion-content> </ion-view>
Question 2: I would like to put static images in the home page, and I would like them to link to a separate categories. Here is the app.js file.
// Ionic App // angular.module is a global place for creating, registering and retrieving Angular modules // 'starter' is the name of this angular module example (also set in a <body> attribute in index.html) // the 2nd parameter is an array of 'requires' // 'starter.controllers' is found in controllers.js angular.module('starter', ['ionic', 'starter.controllers', 'main.controllers']) .run(function($ionicPlatform, $rootScope, $http, $ionicLoading) { $ionicPlatform.ready(function() { // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard // for form inputs) if (window.cordova && window.cordova.plugins.Keyboard) { cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); cordova.plugins.Keyboard.disableScroll(true); } if (window.StatusBar) { // org.apache.cordova.statusbar required StatusBar.styleDefault(); } }); $rootScope.$on('loading:show', function() { $ionicLoading.show({ template: '<ion-spinner icon="spiral" class="spinner-calm"/>' }) }); $rootScope.$on('loading:hide', function() { $ionicLoading.hide() }); }) .config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('login', { url: '/', templateUrl: 'templates/login.html' }); $urlRouterProvider.otherwise("/"); }) // App Service Show alert, Ionic Loading etc .service('appService', ['$ionicPopup', '$ionicLoading', '$timeout', '$http', function($ionicPopup, $ionicLoading, $timeout, $http) { this.url = "http://www.quickkbuy.com"; // Change url as your website url http://your-web-url.com this.appCode = "homand1"; // Change App Code as your app code. find app code in magento backend this.category_id = 0; this.product = {}; this.productGallery = {}; this.getCat = function() { $http.get(this.url + '/xmlconnect/catalog/category/'). then(function(response) { var x2js = new X2JS(); this.categories = x2js.xml_str2json(response.data); }, function(response) { }); return this.categories; }; // An alert dialog this.showAlert = function(status, message, time) { time = typeof time !== 'undefined' ? time : 2000; status = angular.uppercase(status); var alertPopup = $ionicPopup.alert({ title: status, template: message }); $timeout(function() { alertPopup.close(); //close the popup after 3 seconds }, time); }; //Toast meassage this.toast = function(message) { $ionicLoading.show({ template: message, noBackdrop: true, duration: 800 }); }; return this; }]) .factory('$localstorage', ['$window', function($window) { return { set: function(key, value) { $window.localStorage[key] = value; }, get: function(key, defaultValue) { return $window.localStorage[key] || defaultValue; }, setObject: function(key, value) { $window.localStorage[key] = JSON.stringify(value); }, getObject: function(key) { return JSON.parse($window.localStorage[key] || '{}'); } } }]) //State Provider .config(function($stateProvider, $urlRouterProvider, $httpProvider) { $httpProvider.interceptors.push(function($rootScope) { return { request: function(config) { $rootScope.$broadcast('loading:show') return config }, response: function(response) { $rootScope.$broadcast('loading:hide') return response } } }) $stateProvider .state('app', { url: '/app', abstract: true, templateUrl: 'templates/menu.html', controller: 'AppCtrl' }) .state('app.search', { cache: false, url: '/search', views: { 'menuContent': { templateUrl: 'templates/search.html' } } }) .state('app.address', { cache: false, url: '/address', views: { 'menuContent': { templateUrl: 'templates/address.html', controller: 'AddressCtrl' } } }) .state('app.orders', { cache: false, url: '/orders', views: { 'menuContent': { templateUrl: 'templates/orders.html', controller: 'OrderCtrl' } } }) .state('app.details', { cache: false, url: '/orders/details', views: { 'menuContent': { templateUrl: 'templates/orderdetails.html', controller: 'OrderdetailsCtrl' } } }) .state('app.categories', { url: '/categories', views: { 'menuContent': { templateUrl: 'templates/categories.html', controller: 'CategoriesCtrl' } } }) .state('app.products', { url: '/products', views: { 'menuContent': { templateUrl: 'templates/products.html', controller: 'ProductsCtrl' } } }) .state('app.productview', { url: '/productview', views: { 'menuContent': { templateUrl: 'templates/productview.html', controller: 'ProductviewCtrl' } } }) .state('app.home', { url: '/home', views: { 'menuContent': { templateUrl: 'templates/home.html', controller: 'HomeCtrl' } } }) .state('app.wishlist', { cache: false, url: '/wishlist', views: { 'menuContent': { templateUrl: 'templates/wishlist.html', controller: 'WishlistCtrl' } } }) .state('app.cart', { cache: false, url: '/cart', views: { 'menuContent': { templateUrl: 'templates/cart.html', controller: 'CartCtrl' } } }) .state('app.checkout', { cache: false, url: '/checkout', views: { 'menuContent': { templateUrl: 'templates/checkout.html', controller: 'CheckoutCtrl' } } }) // if none of the above states are matched, use this as the fallback $urlRouterProvider.otherwise('/app/home'); });
Please I am new to ionic. Please if you require to file the whole ionic app files, I will send it across. Please help me. It is very urgent.
Thanks
Posts: 3
Participants: 2