-2

在我后面的代码中,我填写了一个 DropDownList 如下(使用 VB)

ddlCountries.DataSource = dt ' dt is DataTable with columns "CountryCode" and "CountryName"
ddlCountries.DataTextField = "CountryName"
ddlCountries.DataValueField = "CountryCode"
ddlCountries.DataBind()
ddlCountries.Attributes.Add("ng-model", "CountryName")

然后是客户端,我有一个选择标签,其中填充了来自服务器端的选项,如下所示:

<select ng-model="CountryName">
    <option value="IN">India</option>
    <option value="US">United States</option>
    <option value="ML">Malaysia</option>
    <!-- and other 200+ records -->
</select>

我这里不能用ng-options!现在,每当我从 更改值时select,我都会得到CountryNameINUSML此外,我无法编辑选项的值,因为它们在服务器端代码中使用。

在这里,我想要CountryNameas IndiaUnited States或者Malaysia相反!我能做些什么?

4

2 回答 2

3

服务器向您发送什么数据?

是这样的对象数组吗?

var countries = [ 
    { name: 'India', code: 'IN'},
    { name: 'United States', code: 'US'},
    { name: 'Malaysia', code: 'ML'}
];

如果是,那么您可以轻松使用 ng-options(即使您不必这样做,它也更好)。

<select ng-model="CountryName"
    ng-options="c.code as c.name for c in countries">
</select>

或者,如果您实际上正在使用服务器端生成的 html 页面并且没有 javascript 对象,那么它有点棘手:(假设您可以使用 JQuery):

看法:

<select id="countryNameSelect" ng-change="setCountryName()">
    <option value="IN">India</option>
    <option value="US">United States</option>
    <option value="ML">Malaysia</option>
    <!-- and other 200+ records -->
</select>

控制器:

$scope.countryName = '';
$scope.setCountryName = function() {
  $scope.countryName = $("#countryNameSelect option:selected").html();
};
于 2014-12-11T15:52:45.843 回答
2

在 PHP BackEnd 数组中到 Json Out: < ? php echo json_encode($arrayDemo); ? >

// Init Load
$(function () {
    'use strict';
    angular
        .module('ngjsapp', [])
        .controller('FormCtrl', ['$scope', function ($scope) {

            var myArraySelect = <?php echo json_encode($arrayDemo); ?>

            $scope.changeSenasaProvinciasId = function (id) {
                console.log(myArraySelect[id]);
            }

        }]);
});

只有 HTML Stact + jQuery

// Option 1
$(function () {
    'use strict';
    angular
        .module('ngjsapp', [])
        .controller('FormCtrl', ['$scope', function ($scope) {

            $scope.changeSenasaProvinciasId = function () {
                console.log($("#mySelectID option:selected").text());
            }

        }]);
});

只有 HTML Stact + jQuery BEST

// Option 2
$(function () {
    'use strict';
    angular
        .module('ngjsapp', [])
        .controller('FormCtrl', ['$scope', function ($scope) {

            var myArraySelect = $('#mySelectID option').each( function() { 
                    myArraySelect.push({$(this).val() : $(this).text() });
                });

            $scope.changeSenasaProvinciasId = function (id) {
                console.log(myArraySelect[id]);
            }

        }]);
});
于 2016-02-23T16:55:57.400 回答