$ http erhalten Abkürzung Programm in AngularJS versauen?

Im folgenden Skript habe ich eine gekürzte Version meines Codes gepostet. Es ist im Wesentlichen eine vereinfachte Suchmaschine.

Das Skript durchläuft das $ scope.list_of_fruit-Array und filtert es entsprechend dem, was in einem einfachen HTML-Eingabetextfeld eingegeben wird.

<script> 
var app = angular.module("myapp",[]); 
app.controller("usercontroller", function($scope){ 
     $http 
     .get("test.php") 
     .then(function (response) { 
      $scope.myData = response.data.records; 
     }); 

     $scope.list_of_fruit = ["apple", "banana", "pear", "kiwi"]; 

     $scope.complete = function(boxtext){ 
      var output = []; 
      angular.forEach($scope.list_of_fruit, function(fruit){ 
       if(fruit.toLowerCase().indexOf(boxtext.toLowerCase()) == 0) 
       { 
        output.push(fruit); 
       } 
      }); 
      $scope.filteredfruit = output; 
     } 
}); 
</script>

Das funktioniert gut und gut, aber wenn ich einfügen, dass http get top anfordern up, das ist völlig unabhängige zu dieser $ scope.complete Schleife, nur die $ scope.complete Schleife nicht mehr funktioniert.

Fehle ich etwas offensichtlich?

Quelle

2017-08-12 master_of_privates

app.controller("usercontroller", function($scope){

Sie haben $ http nicht definiert, so erhalten Sie wahrscheinlich einen Javascript-Fehler.

Add $ http auf die Funktionsparameter:

app.controller("usercontroller", function($scope, $http){

habe ich einen Ausschnitt und das scheint jetzt zu funktionieren

var app = angular.module('myApp', []); 
 

 
app.controller("usercontroller", function($scope, $http){ 
 
     $http 
 
     .get("https://jsonplaceholder.typicode.com/posts") 
 
     .then(function (response) { 
 
     $scope.myData = response.data.records; 
 
     }); 
 

 
     $scope.list_of_fruit = ["apple", "banana", "pear", "kiwi"]; 
 

 
     $scope.complete = function(boxtext){ 
 
      console.log(boxtext); 
 
      var output = []; 
 
      angular.forEach($scope.list_of_fruit, function(fruit){ 
 
       if(fruit.toLowerCase().indexOf(boxtext.toLowerCase()) == 0) 
 
       { 
 
        output.push(fruit); 
 
       } 
 
      }); 
 
      $scope.filteredfruit = output; 
 
     } 
 
});

<!DOCTYPE html> 
 
<html ng-app='myApp'> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<script src="https://rawgit.com/angular/bower-angular/master/angular.min.js"></script> 
 
    
 
    <div ng-controller="usercontroller as vm"> 
 
    {{list_of_fruit}} 
 
    {{filteredfruit}} 
 
    
 
    <input type="text" ng-model="search"/> 
 
    <button ng-click="complete(search)">Do something</button> 
 
    
 
    </div> 
 

 
</body> 
 
</html>

Quelle

2017-08-12 08:05:57 user2340824

$ http erhalten Abkürzung Programm in AngularJS versauen?

Antwort

Verwandte Themen