We help IT Professionals succeed at work.
Get Started

What am I doing wrong with this Angular "get" example?

Bruce Gust
Bruce Gust asked
on
588 Views
Last Modified: 2017-11-26
I'm going through the W3 course on Angular and I'm working through this example: https://www.w3schools.com/angular/tryit.asp?filename=try_ng_customers_mysql

Here's my "term_list_json.php" code:

<?php

header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");

require_once("term_class_pdo.php");

$current_discipline="";
$new_list= new TermAdmin;
$term_display=$new_list->term_list();

$output="";

foreach($term_display as $term)
{
	if($output !="") 
	{
		{$output.= ", ";}
	}
	$output.= '{"disicpline": "' . stripslashes($term['discipline']) .'", ';
	$output.= '"term": "' .stripslashes($term['term']) .'", ';
	$output.='"definition"; "'. stripslashes($term['definition']).'"}';
}
$output = '{"records": ['.$output.']}';

echo $output;

?>

Open in new window


You can see it live at http://brucegust.com/adm/term_list_json.php

Now, here's my code on the Angular side:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Angular Tutorial</title>
<link href="css/stylesheet.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<style>
table, th , td {
  border: 1px solid grey;
  border-collapse: collapse;
  padding: 5px;
}
table tr:nth-child(odd) {
  background-color: #f1f1f1;
}
table tr:nth-child(even) {
  background-color: #ffffff;
}
</style>
</head>
<body style="white-space: normal;">

<div ng-app="myApp" ng-controller="myCtrl">

<table>
	<tr ng-repeat="x in terms">
		<td>{{x.discipline}}</td>
		<td>{{x.term}}</td>
	</tr>
</table>

</div>

<script>
var app=angular.module("myApp", []);
app.controller('myCtrl', function($scope, $http) {
	$http.get("http://brucegust.com/adm/term_list_json.php")
	.then(function (response) {$scope.terms = response.data.records});
});
</script>

<p>With the "ng-options" directive, the selected value can be an object...</p>

</body>
</html>

Open in new window


When you run the page at http://brucegust.com/adm/angular/json_retrieval.php, you get a blank screen, save some text. But there's a huge error that I've got pictured below.

Now sure what I'm doing wrong or how to process that error.

What do I need to change?

Thanks!
Comment
Watch Question
Prepress/OMS Specialist
CERTIFIED EXPERT
Commented:
This problem has been solved!
Unlock 1 Answer and 5 Comments.
See Answer
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE