使用 angular js 和 php 填充 select 列表时出现问题

Question

我正在尝试用我的数据库 (php & mysql) 中的数据填充 select 列表。我正在与 AngularJs 和 Angular Material 合作。所以我无法在列表中显示来自数据库的数据

数据库情况：

tblProjectType -> table
2行：
- id_ProjectType
- project_type

任何帮助或指点都会很棒。

这是我的 html 代码：

<form ng-controller="AppCtrl">
      <div layout="row">
        <md-select-label>Project type</md-select-label>

        <md-select ng-model="project_type" name="project_type" placeholder="Choose a project type" id="containerProjectType">
          <md-option ng-repeat="projecttype in projecttypes" value="{{projecttype.id_ProjectType}}">{{projecttype.project_type}}</md-option>
        </md-select>

      </div>
</form>

我的app.js的代码是：

    var app = angular.module("DragDrop", ['ngMaterial']);
    app.controller('AppCtrl', function($scope, $mdDialog, $http) {

    $scope.projectTypeInfo = [];

    var getProjectTypeFunction = function(succesFn, errorFn)
    {
        $http.get('db.php?action=get_ProjectType_info')// call to the server
        .succesFn(function(data){
            succesFn(data); //call the function passed into getProjectTypeFunction with the data from the server
            console.log('Retrieved data from server');
        })
        .error(errorFn || function() {
            console.log("Error in retrieving data from server");
        })

    }

    this.reloadProjectTypeList = function() 
    {
         getProjectTypeFunction(       
          /* success function */ 
          function(data) { 
              //debugger; 
              $scope.projectTypeInfo = data; 
              //digest recycle
              //if (!$scope.$$phase) { $scope.$apply(); }
          }, 
          /* error function */ 
          function() 
          { 
              alert("Server load failed"); 
          }) 
    };

我的php代码是：

<?php 
include('config.php');

//echo ('test' . $_GET['action']);
switch($_GET['action'])  {
    case 'get_ProjectType_info' :
        get_ProjectType_info(); 
        break;

}

/**  Function to data from tblProjectType **/
function get_ProjectType_info(){
    $qry = mysql_query('SELECT * from tblProjectType');

    echo("test");
    //echo(qry);

    $data = array();
    while($rows = mysql_fetch_array($qry))
    {
        $data[] = array(
                    "id_ProjectType"    => $rows['id_ProjectType'],
                    "project_type"      => $rows['project_type']
                    );
    }

    print_r(json_encode($data));
    return json_encode($data);
}

?>

Answer 1

所以对于初学者来说，让我们清理你的 JS。我们可以将您所拥有的减少为：

var app = angular.module("DragDrop", ['ngMaterial']);

app.controller('AppCtrl', function($scope, $mdDialog, $http)
{
  $scope.projectTypeInfo = [];

  $scope.getProjectTypeFunction = function()
  {
    $http.get('db.php?action=get_ProjectType_info')
      .success(function(data, status, headers, config)
      {
        $scope.projectTypeInfo = data;
        console.log('Retrieved data from server');
        console.log(data);
      })
      .error(function(data, status, headers, config)
      {
        console.log("Error in retrieving data from server");
        console.log(data,status);
      });
  };

  $scope.getProjectTypeFunction(); //-- call the function that invokes $http.get()
};

在 PHP 中，您的函数需要通过 echo json_encode($data); 回显数据，而不是 return 它（如@Avalanche 所述）。

现在，您的控制台应该会输出一些东西，但是您需要从 PHP 中删除 console.log("test");，因为这肯定会导致错误。

编辑

目前您的重复状态：

<md-option ng-repeat="projecttype in projecttypes" value="{{projecttype.id_ProjectType}}">{{projecttype.project_type}}</md-option>

我们已将您的数据存储在 $scope.projectTypeInfo 中，因此需要将其修改为：

<md-option ng-repeat="projecttype in projectTypeInfo" ng-value="projecttype.id_ProjectType">{{projecttype.project_type}}</md-option>

使用 angular js 和 php 填充 select 列表时出现问题

Problems populating a select list with angular js and php

php

mysql

angularjs

angular-material