0

如果这不是任何人见过的最好的代码，我深表歉意。我对 angular.js 有点陌生。

我的问题是：当我的查询返回数据时，它只是显示为一个文本块。在 search.php 中，插入 echo 语句 simple 会显示 echo 语句的输出，而不是生成代码。我似乎无法强制输出正常运行。

$data = file_get_contents("php://input");

$objData = json_decode($data);

$db = mysql_connect("xxxxxxxx", "xxxxxxxx", "xxxxxxxx") or die ("Error connecting to     database.");
mysql_select_db("Awards_New", $db) or die ("Couldn't select the database.");

$results = mysql_query('SELECT * FROM Awards WHERE AwardName LIKE "%'. $objData->data .'%"');

while($row = mysql_fetch_array($results)){
echo $row['AwardName'] . " ";
}

mysql_close($db);

html的一点...

<div ng-controller="SearchCtrl">
    <form class="well form-search">
      <label>Search:</label>
      <input type="text" ng-model="keywords" class="input-medium search-query" placeholder="Keywords...">
      <button type="submit" class="btn" ng-click="search()">Search</button>
      <p class="help-block">Single words only: eg; AFS, University, Geology</p>      
    </form>
    <div ng-model="result">

            {{result}}

    </div>

</div>

和 js ......（这是我最薄弱的环节）

function SearchCtrl($scope, $http) {
$scope.url = 'search.php';
$scope.search = function() {
    $http.post($scope.url, { "data" : $scope.keywords}).
    success(function(data, status) {
        $scope.status = status;
        $scope.data = data;
        $scope.result = data;
    })
    .
    error(function(data, status) {
        $scope.data = data || "Fail.";
        $scope.status = status;         
    });
};
}

我想要做的是在检索时将数据组织到不同的行中。但是，我无能为力。在这一点上，我不确定下一步应该在哪里寻找资源和帮助的方向。

4

1 回答 1

2

您可以利用该ng-repeat函数遍历查询结果的每一行。在这个例子中，我使用了一个<table>结构并ng-repeat在一个元素中放置了一个函数，但是如果你愿意<tr>，你可以ng-repeat在其他元素类型上使用，比如<div>or 。<span>

<body id="ng-app" ng-app="sotest">
<div ng-controller="searchCtrl">
    <form class="well form-search">
      <label>Search:</label>
      <input type="text" ng-model="keywords" class="input-medium search-query"     placeholder="Keywords...">
      <button type="submit" class="btn" ng-click="search()">Search</button>
      <p class="help-block">Single words only: eg; AFS, University, Geology</p>      
    </form>

    <table>
        <tr> <!-- this is the column header row -->
           <th>AwardName</th>
           <th>SomeColumnName</th>
        </tr>
        <tr ng-repeat="row in result"> <!-- this tr will generate for each row in the query result-->
           <td>{{row.AwardName}}</td>
           <td>{{row.SomeColumnName}}</td>
        </tr>
    </table>
</div>
</body>

此外，我建议使用 angularJS DeferredAPI 和 Promises 来获取您的异步数据。您需要将 $q 注入您的控制器才能执行此操作。注意我已经稍微重组了你的 JS 代码，将数据库调用分离成一个函数。

<script type="text/javascript" src="http://code.angularjs.org/1.0.8/angular.min.js"></script>

<script type="Text/javascript" >
var app = angular.module('sotest', []);

app.controller('searchCtrl',['$scope','$http','$q', function SearchCtrl($scope, $http, $q) {

    $scope.search = function(){
        $scope.result = $scope.fetchData();        
    }

    $scope.fetchData= function() {
      $scope.url = 'index.php';
      var deferred = $q.defer();
      $http.post($scope.url).
      success(function(data, status) {
          deferred.resolve(data) 
      })
      .
      error(function(data, status) {    
          deferred.reject('An unexpected error has occurred');
      });
      return deferred.promise; //return the data
  };

  }]);
</script>

我修改了您的 PHP 以返回一个 JSON 编码的数组，并将 $db 连接添加到您的 mysql_query 行：

$data = file_get_contents("php://input");

$objData = json_decode($data);

$db = mysql_connect("xxxxxxxx", "xxxxxxxx", "xxxxxxxx") or die ("Error connecting to     database.");
mysql_select_db("Awards_New", $db) or die ("Couldn't select the database.");

$results = mysql_query('SELECT * FROM Awards WHERE AwardName LIKE "%'. $objData->data .'%"', $db);

$array_result = array();
while($row = mysql_fetch_array($result)){    
  $array_result[] = $row;
}
echo json_encode($array_result);

mysql_close($db);

您可以在此处阅读有关 $q 和延迟承诺的更多信息：http://docs.angularjs.org/api/ng.$q

于 2013-09-16T22:11:54.993 回答