使用 ng-options 创建下拉菜单

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 集合中的主要图片：

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 创建下拉菜单

Creating a Drop Down with ng-options

html

javascript

angularjs

parse-platform