Question

我正在开发一个项目，我似乎无法使用AngularJS向Node.js + MongoDB后端发出API请求。

我有一个如此实例化的api路由：

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

我正在尝试使用Angular在前端构建一些东西，以在浏览器上显示这些结果（以原始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;
      });
  };

Answer 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>

更正了 core.js （之前完全破坏了app.controller语法）

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;
    });

  }
}]);

Answer 2

你实际上需要打电话给你搜索这样的变化：

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你的模特并在那里打电话。

使用Angular

2 个答案: