I'm using ngResource with http to call the rest webservice that I made for the crud and I get this error http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=myApp&p1=Error%3A%2…0yc%20(http%3A%2F%2Flocalhost%3A8088%2Fangular%2Fangular.min.js%3A20%3A274)
I put the angular js script reference properly but it's not working this is my code:
var app = angular.module('myApp', ['ngResource']);
app.controller('StadeController', ['$scope', '$resource',function($scope,$resource) {
function fetchAllStades(){
$scope.stades = $resource('http://localhost:8088/stades'
).query(function(data){return data;});
};
fetchAllStades();
$scope.refresh = function(){
fetchAllStades();
};
$scope.create = function(){
Stade = $resource(
"http://localhost:8088/stades",
{},
{save: {method:'POST',isArray:false}}
);
var stade = {};
stade.id = $scope.stadeForm.id;
stade.name = $scope.stadeForm.description;
stade.phoneNo = $scope.stadeForm.checked;
$scope.Message = Stade.save(stade);
$scope.stadeForm.id = "";
$scope.stadeForm.description="";
$scope.stadeForm.checked="";
};
$scope.deleteRec = function(){
Stade = $resource(
"http://localhost:8088/stades/:id",
{},
{save: {method:'DELETE', params: {id: '@id'}}}
);
Stade.delete({id: $scope.stadeForm.id}).then(function successCallback(response) {
$scope.Message = response;
}, function errorCallback(response) {
});
$scope.stadeForm.id = "";
$scope.stadeForm.description="";
$scope.stadeForm.checked="";
};
$scope.update = function(){
Stade = $resource(
"http://localhost:8088/stades/:id",
{},
{save: {method:'PUT', params: {id: '@id'}}}
);
var stade = {};
stade.id = $scope.stadeForm.id;
stade.description = $scope.stadeForm.description;
stade.checked = $scope.stadeForm.checked;
$scope.Message = Stade.save({id: $scope.stadeForm.id}, stade);
$scope.stadeForm.id = "";
$scope.stadeForm.description="";
$scope.stadeForm.checked="";
};
}]);
<!DOCTYPE html>
<html lang="en">
<body ng-app="myApp">
<div ng-controller="StadeController">
<form name="stadeForm" >
<table class="table stripped">
<thead><tr><th>ID </th> <th>checked</th> <th>description</th></tr></thead>
<tbody><tr ng-repeat="row in stades">
<td><span ng-bind="row.id"></span></td>
<td><span ng-bind="row.description"></span></td>
<td><span ng-bind="row.checked"></span></td>
<td>
</tr> </tbody>
</table>
<p class="bg-info info-msg" id="info1">{{Message}}</p>
<div class="form-group" >
<label class=blue_font>description</label>
<input class=form-control type="text" id="description" ng-model="stadeForm.description" placeholder="description">
</div>
<div class="form-group" >
<label class=blue_font>checked</label>
<input class=form-control type="text" id="checked" ng-model="stadeForm.checked" placeholder="checked">
</div>
<div class="btn-wrapper">
<div class="row-gutter-5">
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="create()" id="Create" >Create</button>
</div>
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="refresh()" id="refresh">Refresh</button>
</div>
</div>
</div>
<div class="form-group" >
<label class=blue_font>ID</label>
<input class=form-control type="text" id="ID" ng-model="stadeForm.id" placeholder="ID">
</div>
<div class="btn-wrapper">
<div class="row-gutter-5">
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="deleteRec()" id="Delete" >Delete</button>
</div>
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="update()" id="Update">Update</button>
</div>
</div>
</div>
</form>
</div>
<script src="angular/angular.min.js"></script>
<script src="angular/angular-resource.min.js"></script>
<script src=app/app.js"></script>
<link rel="stylesheet" href="bootsrap/style.css">
<link rel="stylesheet" href="bootsrap/theme-default.css">
<link rel="stylesheet" href="bootsrap/theme-blue.css">
<link rel="stylesheet" href="bootsrap/bootstrap.min.css">
<link rel="stylesheet" href="bootsrap/custom.css">
</body>
</html>
Error on the line <script src=app/app.js"></script>
. Open " is missing.
It should be <script src="app/app.js"></script>
<!DOCTYPE html>
<html lang="en">
<body ng-app="myApp">
<div ng-controller="StadeController">
<form name="stadeForm" >
<table class="table stripped">
<thead><tr><th>ID </th> <th>checked</th> <th>description</th></tr></thead>
<tbody><tr ng-repeat="row in stades">
<td><span ng-bind="row.id"></span></td>
<td><span ng-bind="row.description"></span></td>
<td><span ng-bind="row.checked"></span></td>
<td>
</tr> </tbody>
</table>
<p class="bg-info info-msg" id="info1">{{Message}}</p>
<div class="form-group" >
<label class=blue_font>description</label>
<input class=form-control type="text" id="description" ng-model="stadeForm.description" placeholder="description">
</div>
<div class="form-group" >
<label class=blue_font>checked</label>
<input class=form-control type="text" id="checked" ng-model="stadeForm.checked" placeholder="checked">
</div>
<div class="btn-wrapper">
<div class="row-gutter-5">
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="create()" id="Create" >Create</button>
</div>
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="refresh()" id="refresh">Refresh</button>
</div>
</div>
</div>
<div class="form-group" >
<label class=blue_font>ID</label>
<input class=form-control type="text" id="ID" ng-model="stadeForm.id" placeholder="ID">
</div>
<div class="btn-wrapper">
<div class="row-gutter-5">
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="deleteRec()" id="Delete" >Delete</button>
</div>
<div class="col-md-4 col-xs-6 col-sm-6">
<button class="btn btn_blue" type="button" data-ng-click="update()" id="Update">Update</button>
</div>
</div>
</div>
</form>
</div>
<script src="angular/angular.min.js"></script>
<script src="angular/angular-resource.min.js"></script>
<script src="app/app.js"></script>
<link rel="stylesheet" href="bootsrap/style.css">
<link rel="stylesheet" href="bootsrap/theme-default.css">
<link rel="stylesheet" href="bootsrap/theme-blue.css">
<link rel="stylesheet" href="bootsrap/bootstrap.min.css">
<link rel="stylesheet" href="bootsrap/custom.css">
</body>
</html>