Jako naukę angulara wybrałem sobie za zadanie napisanie prościutkiej gry
na WWW: http://gra.w16.pl/angular/
na GITHUBie: https://github.com/RobertRorog/appGame

Mam problem ze zmienną globalną, wczytuję tablicę z wartościami z pliku JSONa i nie mogę się do nich dostać w żaden sposób w aplikacji.


<script>
var app = angular.module('myApp', []), global={};
app.controller('customersCtrl', function($scope, $http) {


$http.get("customers.php").then(function (response) {
$scope.myData = response.data.records;
global.obj = response.data.records;
console.log(global); // tu jest OK JSON ladnie sie wczytal
});

console.log(global); // ale potrzebuje tu sie dostac do wartosci i nie sa widoczne

});
</script>

A w konsoli w jakiej kolejnosci widzisz console.log ?

no faktycznie najpierw widzę to co potrzebuje a dopiero to co jest wczytanie

pusty obiekt

request get

pełny obiekt

jak to zmienić aby poczekać na get i odwołać się do obiektu po wykonaniu requestu?

Po to wlasnie jest .then by zlapac co po zakonczeniu requestu, Czemu tam nie zrobisz co masz zrobic?

kombinuję na różne sposoby ale poza funkcją wczytania JSONA dane nie są widoczne

mam fabrykę z then i w niej jest ok ale poza już nie widać nic, za słaby jeszcze jestem w JSie

[HTML] pobierz, plaintext 
    factoryMinesData.getData().then(function(data){  
        $scope.listOfMines = data[1];
       $scope.resGold = data[1][0].resources.res;
       $scope.resStone = data[1][1].resources.res;
       $scope.resWood = data[1][2].resources.res;
       $scope.resStorage = data[1][3].resources.res;
       console.log(data[1]);
    });
 
    console.log($scope.listOfMines); // nie wiczać
[HTML] pobierz, plaintext 

Zrozum wkoncu, ze to jest AJAX i jest ASYNCHRONICZNY. Po to wlasnie jest THEN by w nim robic wszystko co ma sie robic po wczytaniu ajax. Czemu nie chcesz tego zrobic THEN tylko sie upierasz i ciagle robisz poza THEN??

Nie upieram się tylko z mojej niewiedzy chciałem mieć globalny dostęp do obiektu tablicy JSON po jej wczytaniu.

Dzięki za podpowiedź.

I masz po jej wczytaniu. Ino tylko ze wczytanie nastepuje pozniej niz ci sie wydawalo

No to w takim razie będę cierpliwie czekał na wczytanie danych

Dam jakiś interwał i sprawdzanie czy wszystkie dane JSON wczytały się, a userowi dam spinnera, co sądzisz o takim rozwiązaniu?

No ale czy ty czytasz co sie do ciebie pisze? THEN sie odpala po wczytaniu i juz. NIe musisz robic zadnych interwalow....

W przypadku AJAX przestan myslec staroswiecko LINI PO LINII. AJAX sie tak nie wykonuje. Po to wymyslono wiec THEN i on sie odpali po wykonaniu AJAX. ALe kod co miales poza THEN odpali sie duzo wczesniej. DLatego swojej rzeczy masz zrobic w THEN

Dzięki za dogłębne wytłumaczenie problemu i naprowadzanie mnie mimo mojej upartości. Wstawiam moje rozwiązanie, może komuś się przyda.



To jest ładowarka JSONÓW i inicjalizacja strony

[HTML] pobierz, plaintext 
$scope.loadFeed = function() {
 
            factoryMinesData.getData().then(function(data){  
                $scope.listOfMines   = data[1];
 
                return data;
            }).then(function(data){  
               $scope.listDataMines   = data[0];
 
                return data;
            }).then(function(data){
                console.log($scope.listOfMines);   // jest OK
                console.log($scope.listDataMines); // jest OK
 
                $('#mydiv').hide();  
            });  
	}
 
	$scope.loadFeed();
[HTML] pobierz, plaintext 

to jest SPINNER na stronie

[HTML] pobierz, plaintext 
<div id="mydiv">
    <img src="assets/img/ajax-loader.gif" class="ajax-loader"/>
</div>
 
<style>
#mydiv {  
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1000;
    background-color:grey;
    opacity: .8;
 }
 
.ajax-loader {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -32px; /* -1 * image width / 2 */
    margin-top: -32px;  /* -1 * image height / 2 */
    display: block;     
}
</style>
[HTML] pobierz, plaintext