[Solved] How to get global variable in /app and /home?

ionic-v1
1

Hi,

How can I get a global variable value AFTER .run at menu.html and home.html?

I’ve tried $rootScope too, but I can’t use it in .config.

I created a minimal project here to exemplify: https://github.com/renanaraujo/global
And here it’s a codepen too: http://codepen.io/anon/pen/MYorrY?editors=101

As you can see, at home.html it alerts ‘outside’ and at escolas.html alerts ‘db_data’.

I created a <div ng-controller="escolasCtrl"> in home, but it continues to show ‘outside’ value.

The global variable works fine EXCEPT at /app and /home.

Help me please.
Thanks!!!

2

use a service/factory to hold the information and inject the factory/service into your controllers

This post has a complete example and links to more explanation to why you really shouldn’t be using rootScope http://stackoverflow.com/questions/12008908/how-can-i-pass-variables-between-controllers

2 Likes
3

Declare the variable db before anything else in the file, at the moment you initialise and update db inside $ionicPlatform.ready and that is why it is contained there. You can update a global variable only if you declare a “global” variable. Hope this helps :slight_smile: otherwise look at this page: http://www.w3schools.com/js/js_scope.asp

4

I created the service, and it worked to my codepen example, but in my real code I’m using $cordovaSQLite:

    .service('Database', function($cordovaSQLite) {
        var db = $cordovaSQLite.openDB({name: "esaojoao.db"});
        return {
            getDb: function() {
                return db;
            }
        };

    })

And I got a new issue. I’m using $cordovaSQLite, but I don’t have access to this variable in the service WHEN the service is used in menu.html and home.html. In the other pages it works fine. =/

Thanks for the help!!

What should I do to fix this?

5

How about trying to do what they did in this tutorial? :slight_smile:

1 Like
6

Thanks for the help man.

I followed this tutorial.

And this is exactry the problem I’m getting.

Following this tutorial I don’t have access to global variable db, and $cordovaSQLite in controller or service
if it’s used in menu.html or home.html.

I talked to the creator of the tutorial too…he’s a nice guy but I have a poor english and he could not help me.

I don’t know what to do =/

7

There’s no problem with that tutorial and the variable db is a global variable. I’m sorry but I don’t know how else to explain it to you?

8

This tutorial works fine, but he doesn’t use .config and $urlRouterProvider.

The problem is at:

$urlRouterProvider.otherwise('/app/home');

if I change to:

$urlRouterProvider.otherwise('/app/about');

The service will work in home, but not in about.

I think, it doesn’t work in menu, because it is /app state, so /app and /app/home don’t have access to $cordovaSQLite because $urlRouterProvider

9

why don’t you post your code? The basic concept of using a Service should address your problem, yet you still cannot get it to work so it appears to me you are missing an understanding of how to utilize a Service… A Service can be injected into any module?

10

Yes, the service works fine at all my controllers created in all templates, except at menu.html (/app) and home.html (/app/home)

home.html

<ion-view view-title="Home">
    <ion-content>
        <div ng-controller="TagsCtrl">
               <!-- $cordovaSQLite === undefined -->
        </div>
    </ion-content>
</ion-view>

others.html

<ion-view view-title="Others">
    <ion-content>
        <div ng-controller="TagsCtrl">
               <!-- $cordovaSQLite === Object works fine -->
        </div>
    </ion-content>
</ion-view>

controller.js

     .controller('TagsCtrl', function($scope, Database) {
                         db = Database.getDb();
     })

services.js

.service('Database', function($cordovaSQLite) {
    var db = $cordovaSQLite.openDB({name: "esaojoao.db"});
    return {
        getDb: function() {
            return db;
        }
    };
})

The problem is in $urlRouterProvider at app.js, but I need this.

11

I fixed it.

I created another state:

                .state('welcome', {
                    url: "/welcome",
                    templateUrl: "templates/welcome.html",
                    controller: 'WelcomeCtrl'

                })

and I changed the urlRouterProvider:

$urlRouterProvider.otherwise('/welcome');

and in welcome.html:

    < div style="width: 100%; height: 100%;" >
        < a href="#/app/home" >
            < img src="img/logo.png" style="width: 100%; height: 100%;" >
        < /a>
    < /div>

I don’t know why the first page loaded has this bugs, but this worked to me.

Thanks for the support folks!!!