Question

我有一个select选项，需要填充数据库中的数据（JSON）

但即使我拥有正确的json数据也不会填充

sample.html

<div class="form-group form-group-sm">
    <label class="sr-only" for="inputDoctype">Type</label>
    <select aria-describedby="basic-addon1" class="form-control" ng-model="matin.type" ng-options="x.type for x in data">
        <option value="{{x.type}}">{{x.type}}</option>
    </select>
</div>

controller.js

var xhr = $http({
    method: 'post',
    url: 'http://localhost/onseral/api/list-doctype.php'
});
xhr.success(function(data){
    console.log(JSON.stringify(data));
    $scope.data = data.type;
});

列表doctype.php

<?php

require_once '/config/dbconfig.php';

$table = (isset($_GET['table'])) ? $_GET['table'] : NULL;

getById($table);

function getById() {
    $sql = "SELECT distinct type FROM min_in_head order by type asc";
    try {
        $db = getdb();
        $stmt = $db->prepare($sql);
        $stmt->execute();
        $data = $stmt->fetchAll(PDO::FETCH_OBJ);
        $db = null;
        echo json_encode($data);

    } catch(PDOException $e) {
        echo '{"error":{"text":'. $e->getMessage() .'}}';
    }
}
?>

控制台结果

[{"type":"Adj"},{"type":"WC IN"}]

任何人都知道为什么？

Answer 1

首先你的json看起来不合乎逻辑，我也会把它变成现在：

{"type":["Adj","CONS OUT"]}

但无论如何，你需要使用angular http服务来填充范围！所以它会是这样的：

$http.post('http://localhost/onseral/api/list-doctype.php').then(function(res) {
        $scope.matin= res.data;
    });

Answer 2

试试这个

<div class="form-group form-group-sm">
    <label class="sr-only" for="inputDoctype">Type</label>
    <select aria-describedby="basic-addon1" class="form-control" ng-model="matin.type" ng-options="x as x.type for x in data">
    </select>
</div>

Answer 3

你可以使用它

<select class="form-control" ng-model="matin.type" ng-options="x.type for x in data">
     <option value ="">select one</option>
</select>

不需要

<option value="{{x.type}}">{{x.type}}</option>

Angularjs未加载数据以选择选项

3 个答案: