2017-04-10 10 views
1

laden Ich verwende ngResource mit http den Rest WebService zu nennen, die ich für die crud gemacht und ich bekomme diesen Fehler 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)ngResource versagt

ich richtig die Winkel js Skript Bezug setzen, aber es funktioniert nicht dieses mein 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(){ 
 
    \t fetchAllStades(); 
 
    }; 
 
    
 
    $scope.create = function(){ 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'POST',isArray:false}} 
 
    \t); 
 
    \t 
 
    \t var stade = {}; 
 
\t \t 
 
    \t stade.id = $scope.stadeForm.id; 
 
    \t stade.name = $scope.stadeForm.description; 
 
    \t stade.phoneNo = $scope.stadeForm.checked; 
 
\t \t 
 
\t \t $scope.Message = Stade.save(stade); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
    $scope.deleteRec = function(){ 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades/:id", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'DELETE', params: {id: '@id'}}} 
 
    \t); 
 
    \t 
 
\t \t \t 
 
\t \t Stade.delete({id: $scope.stadeForm.id}).then(function successCallback(response) { 
 
\t \t \t $scope.Message = response; 
 
\t \t }, function errorCallback(response) { 
 
\t \t  
 
\t \t }); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
    
 
    $scope.update = function(){ 
 
    \t \t 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades/:id", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'PUT', params: {id: '@id'}}} 
 
    \t); 
 
    \t 
 
\t \t var stade = {}; 
 
\t \t 
 
\t \t stade.id = $scope.stadeForm.id; 
 
\t \t stade.description = $scope.stadeForm.description; 
 
\t \t stade.checked = $scope.stadeForm.checked; 
 
\t \t 
 
\t \t $scope.Message = Stade.save({id: $scope.stadeForm.id}, stade); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
}]);
<!DOCTYPE html> 
 
<html lang="en"> 
 
<body ng-app="myApp"> 
 
<div ng-controller="StadeController"> 
 
\t <form name="stadeForm" > 
 
\t 
 
\t <table class="table stripped"> 
 
\t  <thead><tr><th>ID </th> <th>checked</th> <th>description</th></tr></thead> 
 
\t  <tbody><tr ng-repeat="row in stades"> 
 
\t   <td><span ng-bind="row.id"></span></td> 
 
\t   <td><span ng-bind="row.description"></span></td> 
 
\t   <td><span ng-bind="row.checked"></span></td> 
 
\t   <td> 
 
\t \t </tr> \t </tbody> 
 
\t </table> 
 
\t <p class="bg-info info-msg" id="info1">{{Message}}</p> 
 
\t <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> 
 
\t 
 
\t <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>  
 
\t <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>  
 
\t  
 
\t </form> 
 
\t </div> 
 
\t <script src="angular/angular.min.js"></script> 
 
\t <script src="angular/angular-resource.min.js"></script> 
 
\t <script src=app/app.js"></script> 
 
\t <link rel="stylesheet" href="bootsrap/style.css"> \t 
 
\t <link rel="stylesheet" href="bootsrap/theme-default.css"> 
 
\t <link rel="stylesheet" href="bootsrap/theme-blue.css"> 
 
\t <link rel="stylesheet" href="bootsrap/bootstrap.min.css"> 
 
\t <link rel="stylesheet" href="bootsrap/custom.css"> 
 
</body> 
 
</html>
ich weiß nicht, warum es nicht funktioniert und ich sah die bisherigen Beiträge, die Probleme wie bei mir haben, aber es hat nicht funktioniert

+0

nicht eckig minimierte verwenden und die genauen Fehler mit dem HTML-Link in der Konsole – harishr

+0

ich das getan hätte herausfinden, aber es hilft nicht viel –

+0

Ich habe 2 hinzugefügt skript tag für reference.now überprüfen Sie mit Ihrer api. sehen Sie auch, wenn es einen Fehler in der Konsole. (durch Drücken von F12) –

Antwort

0

Fehler auf der Linie <script src=app/app.js"></script>. Open "fehlt.

Es <script src="app/app.js"></script>

sein sollte
<!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> 
+0

vielen Dank !! Wieso habe ich nicht gesehen, dass xD –

+0

der Fehler weg ist –

0

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(){ 
 
    \t fetchAllStades(); 
 
    }; 
 
    
 
    $scope.create = function(){ 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'POST',isArray:false}} 
 
    \t); 
 
    \t 
 
    \t var stade = {}; 
 
\t \t 
 
    \t stade.id = $scope.stadeForm.id; 
 
    \t stade.name = $scope.stadeForm.description; 
 
    \t stade.phoneNo = $scope.stadeForm.checked; 
 
\t \t 
 
\t \t $scope.Message = Stade.save(stade); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
    $scope.deleteRec = function(){ 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades/:id", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'DELETE', params: {id: '@id'}}} 
 
    \t); 
 
    \t 
 
\t \t \t 
 
\t \t Stade.delete({id: $scope.stadeForm.id}).then(function successCallback(response) { 
 
\t \t \t $scope.Message = response; 
 
\t \t }, function errorCallback(response) { 
 
\t \t  
 
\t \t }); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
    
 
    $scope.update = function(){ 
 
    \t \t 
 
    \t Stade = $resource(
 
    \t \t  "http://localhost:8088/stades/:id", 
 
    \t \t  {}, 
 
    \t \t  {save: {method:'PUT', params: {id: '@id'}}} 
 
    \t); 
 
    \t 
 
\t \t var stade = {}; 
 
\t \t 
 
\t \t stade.id = $scope.stadeForm.id; 
 
\t \t stade.description = $scope.stadeForm.description; 
 
\t \t stade.checked = $scope.stadeForm.checked; 
 
\t \t 
 
\t \t $scope.Message = Stade.save({id: $scope.stadeForm.id}, stade); 
 
\t \t \t \t 
 
\t \t $scope.stadeForm.id = ""; 
 
\t \t $scope.stadeForm.description=""; 
 
\t \t $scope.stadeForm.checked=""; 
 
    }; 
 
    
 
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script> 
 

 
<!DOCTYPE html> 
 
<html lang="en"> 
 
<body ng-app="myApp"> 
 
<div ng-controller="StadeController"> 
 
\t <form name="stadeForm" > 
 
\t 
 
\t <table class="table stripped"> 
 
\t  <thead><tr><th>ID </th> <th>checked</th> <th>description</th></tr></thead> 
 
\t  <tbody><tr ng-repeat="row in stades"> 
 
\t   <td><span ng-bind="row.id"></span></td> 
 
\t   <td><span ng-bind="row.description"></span></td> 
 
\t   <td><span ng-bind="row.checked"></span></td> 
 
\t   <td> 
 
\t \t </tr> \t </tbody> 
 
\t </table> 
 
\t <p class="bg-info info-msg" id="info1">{{Message}}</p> 
 
\t <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> 
 
\t 
 
\t <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>  
 
\t <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>  
 
\t  
 
\t </form> 
 
\t </div> 
 
\t <script src="angular/angular.min.js"></script> 
 
\t <script src="angular/angular-resource.min.js"></script> 
 
\t <script src=app/app.js"></script> 
 
\t <link rel="stylesheet" href="bootsrap/style.css"> \t 
 
\t <link rel="stylesheet" href="bootsrap/theme-default.css"> 
 
\t <link rel="stylesheet" href="bootsrap/theme-blue.css"> 
 
\t <link rel="stylesheet" href="bootsrap/bootstrap.min.css"> 
 
\t <link rel="stylesheet" href="bootsrap/custom.css"> 
 
</body> 
 
</html>

+0

Ich verweise bereits die angular.min.js und angular-resource.min.js am unteren Rand –