Json defaults when I request via angular http

Asked

Viewed 200 times

1

I’m making an add-on to Firefox and this is powered by json that comes from an ajax request, which I do via http get method.

When I print the json by calling the address directly on the screen, it displays normally, but when I request it from the angle it accuses the json of syntax error.

Follows the scripts

File generating the Json

I changed the script a little bit, but now accuses that what I’m receiving is not an object

how did the class :

<?php 

header('Content-Type: application/json');

class ListaDeLinks{
    public $links = array();
    function  __construct(){ }
    function addLink($nome,$link){
        $this->links[$nome] = $link;
    }
}

$l = new ListaDeLinks();
$l->addLink('google','http://www.google.com');
$l->addLink('bing','http://www.bing.com');
$l->addLink('yahoo','http://www.yahoo.net');

$rest = json_encode($l);

echo $rest;

?>

File that receives Json

var lilink = angular.module('lilinkApp',[]);
lilink.controller('lilinkController',lilinkController);
lilinkController.$inject = ['$scope','$http'];

function lilinkController($scope,$http){
    $scope.lilink = "lilink";
    $http.get('http://localhost/webS/lkrest.php')
    .then(function(data){
        $scope.links  = data;
    },function(errData){
        console.log(errData);
    });
}

Presentation

<!DOCTYPE html >
<html lang="pt-BR" ng-app="lilinkApp">

<head>
    <meta charset="UTF-8">
    <title>LiLink</title>
    <link rel="stylesheet" href="../css/bootstrap.css">
    <script src="../js/jquery.js"></script>
    <script src="../js/angular.js"></script>
    <script src="../js/bootstrap.js"></script>

    <link rel="stylesheet" href="../css/lilink.css">
    <script src="../js/lilink.js"></script>
</head>

<body>
    <main ng-controller="lilinkController" class="container-fluid">

        <nav class="row">
            <div class="col-sm-12">

            </div>
        </nav>

        <div class="row">
            <section style="background-color:#afa" id="links" class="col-sm-8" >
                {{links}}
            </section>
            <section style="background-color:#faa" id="notificacoes" class="col-sm-4">
                {{lilink}}
            </section>
        </div>
    </main>
</body>

</html>

Print of the presentation screen Print da tela de apresentação

javascript html ajax angularjs json

  • try $http.get('http://localhost/Webs/lkrest.php'). then(then Function(data) ? $Scope.links = data})

  • Hello, Emanuel! Welcome to [en.so]! You could post an example of JSON output?

  • {"links":{"google":"http://www.google.com","Bing":"http://www.bing.com","yahoo":"http://www.yahoo.net"}}

  • The error that appears in the print seems not to match the Javascript code. Are you sure you are not doing $http.get({ method: "POST" ... }) or something like that? This can also be cached from an old version of the script. By the way, maybe caching is the cause of several strange mistakes you’ve had so far and the reason it seems like sometimes something doesn’t work when it’s right.

1 answer

0


Since the return is 

{"links":{"google":"http:\/\/www.google.com","bing":"http:\/\/www.bing.com","yah‌​oo":"http:\/\/www.yahoo.net"}
}

on the return of the $http.get function, which is date, you take the information through the data.links

function lilinkController($scope,$http){
    $scope.lilink = "lilink";
    $http.get('http://localhost/webS/lkrest.php')
    .then(function(data){
        $scope.links  = data.links;
    },function(errData){
        console.log(errData);
    });
}

Browser other questions tagged javascript html ajax angularjs json

You are not signed in. Login or sign up in order to post.