?
Solved

AngularJS code cannot detect the local file via http get

Posted on 2014-07-14
13
Medium Priority
?
6,230 Views
Last Modified: 2014-09-10
I wanted the following example file to run. The files are at https://github.com/curran/screencasts/tree/gh-pages/introToAngular/examples/snapshots/snapshot20 .
The .htm file expects a file named countries.json. I have this file (myfile.htm) and countries.json in the same directory C:\inetpub\wwwroot\ajs\ .

But apparently the html file cannot detect the countries.json file. I get empty content with the header of Country       Population when I open up the page in browser (http://localhost/ajs/myfile.htm)

I tried with the entire path like below:
   $http.get(C:\inetpub\wwwroot\ajs\countries.json').success(function(data) {

But that does not make any difference. Could you please suggest what is wrong here. Many thanks.

----myfile.htm----
<html ng-app="countryApp">
  <head>
    <meta charset="utf-8">
    <title>Angular.js Example</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
    <script>
      var countryApp = angular.module('countryApp', []);
      countryApp.controller('CountryCtrl', function ($scope, $http){
        $http.get(countries.json').success(function(data) {
          $scope.countries = data;
        });
      });
    </script>
  </head>
  <body ng-controller="CountryCtrl">
    <table>
      <tr>
        <th>Country</th>
        <th>Population</th>
      </tr>
      <tr ng-repeat="country in countries">
        <td>{{country.name}}</td>
        <td>{{country.population}}</td>
      </tr>
    </table>
  </body>
</html>

Open in new window

0
Comment
Question by:toooki
  • 5
  • 5
11 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40196366
I don't much about Angular but you keep leaving off the opening quote in your statements.  Should be like this:
$http.get('countries.json').success(function(data) {

Open in new window

https://docs.angularjs.org/api/ng/service/$http
0
 
LVL 83

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 40197635
yes, the code work fine, just a typo error

<html ng-app="countryApp">
  <head>
    <meta charset="utf-8">
    <title>Angular.js Example</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
    <script>
      var countryApp = angular.module('countryApp', []);
      countryApp.controller('CountryCtrl', function ($scope, $http){
        $http.get('countries.json').success(function(data) {
          $scope.countries = data;
        });
      });
    </script>
  </head>
  <body ng-controller="CountryCtrl">
    <table>
      <tr>
        <th>Country</th>
        <th>Population</th>
      </tr>
      <tr ng-repeat="country in countries">
        <td>{{country.name}}</td>
        <td>{{country.population}}</td>
      </tr>
    </table>
  </body>
</html>

Open in new window

0
 

Author Comment

by:toooki
ID: 40198068
Thank you.

I tried with
     $http.get('countries.json').success(function(data) {

But still it did not work. It does not retrieve any values from the json file. I downloaded the json file from https://github.com/curran/screencasts/blob/gh-pages/introToAngular/examples/snapshots/snapshot20/countries.json
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 83

Expert Comment

by:leakim971
ID: 40198148
me too.
please confirm you're using http or https to open the page else it will not work
0
 

Author Comment

by:toooki
ID: 40198207
I am using http
This is the url
http://localhost/ajs/myfile.htm
or
localhost/ajs/myfile.htm
0
 
LVL 83

Expert Comment

by:leakim971
ID: 40198212
could you publish it over internet?
0
 

Author Comment

by:toooki
ID: 40199714
I tried but sorry could not succeed to publish to internet.
0
 
LVL 83

Expert Comment

by:leakim971
ID: 40199719
what is the issue ?
0
 

Author Comment

by:toooki
ID: 40200020
I can publish to my PC (localhost) as I have IIS running. How could I publish to internet?
0
 
LVL 83

Expert Comment

by:leakim971
ID: 40200081
you need to open port 80 (or any other) on your router and do a NAT to your localhost
0
 

Author Comment

by:toooki
ID: 40243031
I did not understand what you meant by open port 80. My apology.
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A quick Powershell script I wrote to find old program installations and check versions of a specific file across the network.
A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
Learn the basics of while and for loops in Python.  while loops are used for testing while, or until, a condition is met: The structure of a while loop is as follows:     while <condition>:         do something         repeate: The break statement m…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses
Course of the Month15 days, 18 hours left to enroll

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question