0

I typeahead bin mit meiner alle cameraid anzuzeigen und meine Daten zu suchen, aber es gibt mir keine Daten auf dem typeahead, wie es mir [object Object] zeigt.keine Daten bei der Verwendung von Bootstrap und AngularJS eingeben

Wer kann mir dabei helfen?

enter image description here

meine HTML-Datei:

<div class="container-fluid"> 

<h1><a href="http://localhost:8081/"><span class="glyphicon glyphicon-home 
">Image Viewer</span></a></h1> 
</div> 
<br> 
<div ng-controller="Hello" class="col-xs-12"> 


<b>Search:</b><br> 

<input type="text" ng-model="searchBox" uib-typeahead="state for state in records | filter:$viewValue | limitTo:8" class="form-control">   

<table class="table table-striped table-hover" style="width:55%"> 
    <thead> 
     <tr> 

     <th>CamID</th> 
     <th>Timestamp</th> 
     <th>View Image</th> 

     </tr> 
    </thead> 

    <tbody> 
     <tr ng-repeat="record in records | filter:searchBox | orderBy:'+timestamp'"> 

     <td>{{record.cameraid}}</td> 
     <td>{{record.timestamp}}</td> 
     <td>{{record.filename}}</td> 
     <td><button class="btn btn-primary" ng-click="toggleCustom()" onclick="myFunction()">View</button></td> 

     </tr> 
    </tbody> 
    </table> 

Meine jsp-Datei:

var camListApp = angular.module('camListApp', ['ui.bootstrap']) 
camListApp.controller("Hello", ["$scope", "$http", function($scope, $http){ 

$scope.custom = true; 
$scope.toggleCustom = function() { 
    $scope.custom = ! $scope.custom; 
}; 

$http.get('http://localhost:8081/camera/list').then(function(response) { 
    console.log(response); 
     $scope.records= response.data; 
    }); 
}]); 

Meine json Daten:

[{"id":23,"cameraid":"001","timestamp":"2016/06/15 17:27","filename":"452c5d867b563e937d44d48ebc326c7a"}, 
{"id":24,"cameraid":"000000006f4280af","timestamp":"2016/06/15 17:27","filename":"ee90428e4e0c19ba9858285398bf4fbb"}, 
{"id":25,"cameraid":"002","timestamp":"2016/06/15 17:28","filename":"c9a4fb339f6981ffd679937724167de8"}, 
{"id":26,"cameraid":"000000006f4280af","timestamp":"2016/06/15 17:28","filename":"a1df86417d958e670750cf8172a2b7dd"} 
+0

Ich glaube, Sie brauchen, um benutzerdefinierte Filter auf diesen Link zu machen überprüfen [http://stackoverflow.com/questions/15196161/angularjs-how-to-structure-a-custom-filter-with-ng-repeat-to-return -Items-cond] (http://stackoverflow.com/questions/15196161/angularjs-how-to-structure-a-custom-filter-with-ng-repeat-to-return-items-cond) –

+0

ich in der Lage Meine Suche filtern aber ist die typeahead besagen mich nicht meiner Daten. –

Antwort

1

Eigentlich geben Sie alle Objekte zurück, deshalb erhalten Sie "object Object", Sie müssen angeben, welchen Teil Sie verwenden werden.

uib-typeahead="state.cameraid as state.cameraid for state in records | filter:$viewValue | limitTo:8"

Der erste state.cameraid ist, was Sie in der Liste angezeigt werden der zweite Wert ist.

Verwandte Themen