tiptop
tiptop

Reputation: 29

Unable to get data

hope all is well!

I am starting out with AngularJS and having some trouble with the $http usage. I have been scouring for the last four hours or so trying to figure this out without luck.

This is the code here:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Whois Test</title>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="css/app.css">
<script src="bower_components/angular/angular.js"></script>
</head>
<body>
<div class="container" ng-app="App">
 <ul>
     <li ng-repeat="answer in answers"></li>
     {{answer}}
 </ul>


 <script>

 angular.module('App', [])
         .controller('Controller', function($scope, $http){

             $http.get('http://api.statdns.com/statdns.net/mx').success(function(data){
                    $scope.answer = data;
             });
         });
  </script>
  </div>
  </body>

What I need it to do is to check the url given and then pull the information from the "answer": section and display that data. Ultimately I want to be able for the user to input the url to parse themselves such as.

$http.get('http://api.statdns.com/{{query}}/mx')

Any help to get me on the right track would be extremely appreciated and helpful.

Upvotes: 0

Views: 45

Answers (2)

Raghavendra
Raghavendra

Reputation: 5387

ng-repeat is used to iterate over a JavaScript array. but the data at http://api.statdns.com/statdns.net/mx doesn't seem to be an array:

{
    "question": [ {...} ],
    "answer": [ {...} ],
    "authority": [ {...} ],
    "additional": [ {...} ],
}

did you mean to iterate over answers? like this:

<ul>
    <li ng-repeat="answer in answers.answer">
        {{answer}}
    </li>
</ul>

Upvotes: 1

Rabi
Rabi

Reputation: 2220

you have done a mistake . $scope.answer = data; should be $scope.answers = data;

update:

<ul ng-controller="Controller">
     <li ng-repeat="answer in answers"> {{answer}}</li>

</ul>

Upvotes: 1

Related Questions