“Foodmania Ionic 4 Restaurants Order App Template”

Created: 09/08/2019
By: S3lman
Email: admin@oniva.com.tr

Thank you for purchasing my Foodmania. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Table of Contents

  1. Sass Project
  2. Network Online/Offline detect
  3. Http Service
  4. Google Map
  5. Form Validators
  6. PHP Code Explanation (If your theme uses PHP)
  7. Flash (If your theme uses Flash)
  8. API Usage (If your theme uses an API)
  9. Any additional unique features that need an overview

Developed with SASS - top

The global.scss file in the root directory of the theme is the main css file. The css properties used in some unique pages are encoded in the scss file in the index of that page.
You can change the colors of the theme from the variables.scss file in the theme folder.

Network Online/Offline detect - top

With the Ionic Native Network, it controls the device's Internet connection. If there is no Internet connection, the application shows you an alert.

      const disconnectSubscription = this.network.onDisconnect().subscribe(() => {
        console.log('network was disconnected :-(');
        this.events.publish('onlineStatus', '0');

      const connectSubscription = this.network.onConnect().subscribe(() => {
        console.log('network connected!');
        this.events.publish('onlineStatus', '1');

      this.events.subscribe('onlineStatus', async (s) => {
        let alert;
        if (s === '0') {
          alert = await this.alertController.create({
            backdropDismiss: false,
            keyboardClose: false,
            header: 'Alert',
            subHeader: 'Subtitle',
            message: 'No network connection!'
          await alert.present();

        } else if (s === '1') {
          await this.alertController.dismiss();

Http Service - top

You can add the Http Service to the page you want to use by using the following code example.

import { Observable } from 'rxjs';

export class HomePage {
  public restaurants: any;

  constructor(private http: HttpClient) {

  loadRestaurants() {
    let data: Observable;
    data = this.http.get('https://domainname.com/foodmania/restaurants.json');
    data.subscribe(result => {
      this.restaurants = result;

Google Map - top

to add Google maps to your page;

  ngAfterContentInit(): void {
    this.fullmap = new google.maps.Map(
          center: {lat: -34.397, lng: 150.644},
          zoom: 8

Form Validators - top

To use a validator in forms, use the following method


		import { FormGroup, Validators, FormBuilder, FormControl } from '@angular/forms';

		export class AuthPage implements OnInit {

		  private onLoginForm: FormGroup;
		    private fb: FormBuilder) {
		    this.onLoginForm = new FormGroup({
		      email: new FormControl('', Validators.pattern('.+\@.+\..+')),
		      password: new FormControl('', [Validators.required, Validators.minLength(6)])


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

@ Oniva Internet

Go To Table of Contents