@rsa wrote:
I was planed to develop an MVC instead SPA if is possible please guide me
index.html
<html ng-app="Myapp"> <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"> <script src="lib/ionic/js/ionic.bundle.js"></script> <script src="cordova.js"></script> </head> <body > <div ng-controller="MainCtrl"> <ion-nav-view> </ion-nav-view> </div> <script src="app/app.js"></script> </body> </html>App.js
angular.module('Myapp', ['ionic']) .run(function($ionicPlatform) { $ionicPlatform.ready(function() { if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) { cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); cordova.plugins.Keyboard.disableScroll(true); } if (window.StatusBar) { StatusBar.styleLightContent(); } }); }) .config(function($ionicConfigProvider) { $ionicConfigProvider.tabs.position('bottom'); }) .config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('app', { url: "/app", templateUrl: 'app/layout/main-layout.html' }) .state('app.main', { url: '/main', views: { 'menuContent' :{ templateUrl: 'app/layout/main.html', } } }); $urlRouterProvider.otherwise('/app'); }) .controller('MainCtrl', function($scope, $ionicSideMenuDelegate) { $scope.toggleLeft = function() { $ionicSideMenuDelegate.toggleLeft(); }; });Main-layout.html
<ion-side-menus> <ion-pane ion-side-menu-content> <ion-nav-bar class="bar-stable"> <ion-nav-buttons side="left"> <button menu-toggle="left" class="button button-icon icon ion-navicon" ng-click="toggleLeft()" ></button> </ion-nav-buttons> <ion-nav-buttons side="right"> <button menu-toggle="right" class="button button-icon icon ion-navicon" ng-click="toggleRight()" ></button> </ion-nav-buttons> </ion-nav-bar> <ion-view name="menuContent"> </ion-view> </ion-pane ion-side-menu-content> <ion-side-menu side="left"> <ion-header-bar align-title="center" class="bar-dark"> <h1 class="title">Menu</h1> </ion-header-bar> <ion-content class="has-header"> <ion-list> <ion-item nav-clear menu-close> Breeds </ion-item> <ion-item nav-clear menu-close> Terminology </ion-item> <ion-item nav-clear > About us</ion-item> <ion-item nav-clear > Contact us</ion-item> </ion-list> </ion-content> </ion-side-menu> <ion-side-menu side="right"> </ion-side-menu> </ion-side-menus>main.html
<ion-tabs class="tabs-icon-top tabs-secondary"> <ion-tab title="Home" icon="ion-home"> <ion-view title="Home"> <ion-content class="padding"> <h4> home content </h4> </ion-content> </ion-view> </ion-tab> <ion-tab title="About" icon="ion-information"> <ion-view title="About"> <ion-content class="padding"> <h4>About</h4> </ion-content> </ion-view> </ion-tab> <ion-tab title="Contact" icon="ion-ionic"> <ion-view title="Contact"> <ion-content class="padding"> <h4>Contact</h4> </ion-content> </ion-view> </ion-tab> </ion-tabs>I will appreciated if you could help me.
Posts: 1
Participants: 1