2016-10-13 1 views
4

Я работаю над проектом, и я не могу сделать запрос API на Node.js + MongoDB, используя AngularJS.Отображение результатов поиска с помощью Angular

У меня есть маршрут апи инстанцированный как таковой:

app.get("/search_database/:queryString", function(req, res) { ... }); 

И я пытаюсь построить что-то на внешнем интерфейсе, используя Угловое, чтобы отобразить эти результаты (в необработанном формате JSON) в браузере - без толку , Запросы API из браузера показывают, что я хочу, но я хочу иметь возможность делать то же самое с AngularJS.

Любые рекомендации приветствуются! Благодаря!

Это то, что я до сих пор:

test.html

<html ng-app="test"> 
<head> 
    <meta charset="utf-8"> 
    <title>Angular.js JSON Fetching Example</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
    <script> src="core.js"</script> 
    </head> 

    <body ng-controller="searchCntrlr"> 
     <div> 
     <input class="search-bar-input", ng-model="searchText"/> 
     </div> 

    {{results}} 
    </body> 


</html> 

core.js

var app = angular.module("test",[]); 

app.controller('searchCntrlr', $scope, $http) { 
    $http. 
     get('/search_database/:searchText/' + $scope.searchText). 
     success(function(res){ 
     $scope.results = res.data; 
     }); 
    }; 

ответ

1

Так я понял, моя проблема - куча чудовищных опечаток:

Исправленная test.html (опечатка была в в течение core.js)

<html ng-app="test"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Angular.js JSON Fetching Example</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
    <script src="core.js"></script> 
    </head> 

    <body ng-controller="searchCntrlr"> 
    <div> 
     <input class="search-bar-input", ng-model="searchText" ng-change="search()"/> 
    </div> 

    {{results}} 
    </body> 

</html> 

Исправленная ядро .js (полностью испорчен синтаксис приложения.контроллер до)

var app = angular.module("test",[]); 

app.controller('searchCntrlr', ['$scope', '$http', function($scope, $http) { 
    $scope.search = function() { 
    $http. 
    get('/search_database/' + $scope.searchText). 
    success(function(res){ 
     $scope.results = res; 
    }); 

    } 
}]); 
0

Вы на самом деле нужно вызвать у вас поиск по изменению как это:

var app = angular.module("test",[]); 

app.controller('searchCntrlr', $scope, $http) { 
    $scope.search = function() { 
    $http. 
    get('/search_database/:searchText/' + $scope.searchText). 
    success(function(res){ 
     $scope.results = res.data; 
    }); 

    } 
}; 

и вызвать эту функцию в шаблоне:

<input class="search-bar-input", ng-model="searchText" ng-change="search()"/> 

Или вручную $watch вашей модели и вызова поиска там.