Question

我想在我的html中使用ng-options创建一个下拉列表。我已经看到了几个关于这个问题的参考文献，并给出了数据结构，变量等方面的差异。我不明白如何将信息从我的Parse后端传输到html前端的下拉列表。

以下是我正在运行的html的片段：

<div class="form-group" ng-repeat="category in allCategories.primary">
    <select ng-model="category.primary" ng-options="bizCategories.primary for bizCategories in allCategories"></select>
</div>

以下是与之相关的Javascript：

var Categories = Parse.Object.extend("bizCategories");


   var categories = new Categories();

    $scope.primarySelect = function() {
        var primary = new Parse.Query(Categories);
        primary.find({
            success:function(list){
                $scope.allCategories = list;
                }
            })
        }

Parse数据库有一个名为bizCategories的集合，其中一个名为primary的列在每行中都有一个单词字符串。

以下是bizCategories集合中的主要图片： enter image description here

Answer 1

<div>
    <select ng-model="bizCategories.primary" ng-options="bizCategories.primary for bizCategories in allCategories"></select>
</div>

试试这个。如果不起作用，请告诉我。

http://jsfiddle.net/ym0d9qaL/

Answer 2

问题是Parse对象要求您使用get('columnName')函数来读取值，而Angular最适合使用普通对象。

我所做的是使用Underscore库将我的Parse对象映射到简单对象，如下所示：

$scope.primarySelect = function() {
    var primary = new Parse.Query(Categories);
    primary.find({
        success:function(list){
            $scope.allCategories = _(list).map(function(item) {
                return {
                    // not sure if you need the ID, remove this line if you don't
                    id: item.id,
                    primary: item.get('primary'),
                    // add any other properties you need here
                };
            });
        }
    });
}

如果需要，您还可以告诉Underscore将其缩小为唯一列表（映射后您必须这样做）。

哦，你也应该将ng-model设置为你想要保持所选对象的范围内的东西（例如ng-model =“selectedPrimary”）。如果您只想要所选文本让我知道，我会给您一个样本的样本。

使用ng-options创建下拉列表

2 个答案: