javascript - 使用 ng-options 在选择下拉列表中显示对象数据

Question

我正在尝试将 angularJS 与 Symfony2 一起使用。 对于初学者，我尝试使用 ng-options 将对象的文本属性显示为简单下拉列表中的选项。 这是 HTML

    <div ng-app="demoAddList" ng-controller="myCtrl">
    <select ng-model="selectedProgram"  ng-options="programofinterest.id as programofinterest.text for programofinterest in programofinterests">
            </select>
        </div>
<p>Try to add the same item twice, and you will get an error message.</p>

这是脚本

var app = angular.module("programDropdown", []);
app.controller("myCtrl", function($scope) {
        $scope.programofinterests = [
            {id: '0', text: 'Masters - Information Systems Management'},
            {id: '1', text: 'Masters - Software Engineering'},
            {id: '2', text: 'Masters - Computer Security'},
            {id: '3', text: 'Bachelors of Computer Science'},
            {id: '4', text: 'Exchange Program'},
            {id: '5', text: 'Study Abroad'},
            {id: '6', text: 'Scientific Summer School'},
            {id: '7', text: 'French Summer School'},
            {id: '8', text: 'ME - Global IT Management'},
            {id: '9', text: 'ME -  Software Development and Multimedia'},
            {id: '10', text: 'ME - Systems, Networks and Security'}
        ];
});

但是结果是空的下拉列表。看一下屏幕截图的左上角

有什么想法吗？

Answer 1

首先尝试修复“JQuery”和“require”问题。这可能也会解决您的 Angular 问题，但不能保证，因为 Angular 通常不需要 JQuery。它嵌入了一种轻量级的 JQuery。

您可以在 Controller 中放置一个断点，然后查看调试器是否到达那里。