Question

我正在尝试以角度创建两个选择框，但只有第一个是appering，任何帮助！ HTML：

<div><p><span id="countryLocale">
CountryName<select ng-model="selectedCountry" ng-options="x for x in names">
</span>
</p>
<p><span id="languageLocale">
Language<select ng-model="selectedLang" ng-options="x for x in langLocale">
</span>
</p>
</div>

控制器：我在控制器中定义了两个静态数组 $ scope.names = [“INDIA”，“France”]; $ scope.langLocale = [“English”，“French”];

Answer 1

关闭选择标记。

<div><p><span id="countryLocale">
CountryName <select ng-model="selectedCountry" ng-options="x for x in names" ></select>
</span>
</p>
<p><span id="languageLocale">
Language<select ng-model="selectedLang" ng-options="x for x in langLocale" ></select>
</span>
</p>
</div>

附加说明 虽然我想回答这个问题，但我尝试了下面的代码无效。

<select ng-model="selectedLang" ng-options="x for x in langLocale" />
<select ng-model="selectedLang" ng-options="x for x in langLocale" />

这是因为在html 5中 <foo />等于<foo>但不等于<foo></foo>

因此，必须像<select></select>一样使用select，而不是<select />

Answer 2

您错过了select元素的结束标记。请使用像 Visual Studio 等编辑器，这样可以突出显示开发过程中的代码错误。

请找到工作演示here。

<强> HTML：

<div ng-app="app" ng-controller="test">
    <div>
        <p>
            <span id="countryLocale">
                CountryName<select ng-model="selectedCountry" ng-options="x for x in names"></select>
            </span>
        </p>
        <p>
            <span id="languageLocale">
                Language<select ng-model="selectedLang" ng-options="x for x in langLocale"></select>
            </span>
        </p>
    </div>
</div>

<强> JS：

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

app.controller('test', function ($scope) {
    $scope.names = ["INDIA", "France"];
    $scope.langLocale = ["English", "French"];
});

两个选择框呈角形，只出现一个

2 个答案: