Angularjs 获取剑道下拉列表中的选定对象

我正在使用剑道下拉列表。更具体地说，我使用剑道角度指令。目前，我的标记中包含以下内容：

<input id='myDropDownList' kendo-drop-down-list ng-model="selectedSport" k-data-source="sports" k-data-text-field="'name'" />
<button ng-click='send()'>Submit</button>

当我运行此代码时，我会得到selectedSport ID。但是，我想要整个对象。我找到的每一个StackOverflow帖子都会使用这个ID。就我个人而言，我不知道如何获取这个对象。有人知道如何获取选定的JSON对象而不仅仅是id吗

---

谢谢

对于剑道角度绑定的当前版本，这个答案可能已经过时了。 正如hally9k在回答中提到的，现在有一个属性可以处理这个问题，所以您可以使用

k-ng-model="selectedSport"

代替

ng-model="selectedSport"

先前的答复如下；如果您使用的是较旧版本的剑道用户界面，则这可能与此相关，也可能与此无关：

我认为您不能将剑道小部件配置为直接存储

数据项

——它下面仍然是一个带有原始值的

。因此，您可能必须从小部件的数据源获取数据项，例如：

HTML:

但是，您可以为kendoDropDownList创建自己的指令，该指令使用

k-data-item

属性（例如），并按如下方式使用：

HTML:

---

这样，您就可以使控制器不受KendoUIDataSource特定代码的影响，而只使用JS数据类型。（请参阅）

我知道这是一个老问题，但您可以使用dropdownlist的select事件来获取底层json对象：

select: function (e) {
    var item = this.dataItem(e.item.index());
    ...
}

---

然后存储select事件中的json对象（上面的item变量），以便从submit方法访问它。可能有一种方法可以在不使用select事件的情况下获取选定的json对象。

使用k-ng-model将绑定数据项，而不仅仅是文本值：

<input id='myDropDownList' kendo-drop-down-list k-ng-model="selectedSport" k-data-source="sports" k-data-text-field="'name'" />

---

获取文本值的正确方法是使用Kendos dropdownlist的“k-select”事件：

<select kendo-drop-down-list k-select="vm.test" k-data-text-field="'groupName'" k-data-value-field="'id'" k-data-source="vm.groupList" ng-model="vm.groupId"></select>

---

我希望这能有所帮助。

你能告诉我运动中的“get”方法来自哪里吗？你能检查一下JSBin上的代码吗？因为当前的示例运行不正确，可能angular-kendo.js的最新版本已经更改了？@Lars，演示效果很好，你能指出你更改了什么吗？你也用最新的angular和剑道测试过吗？@Stef我只是修复了angular剑道的链接（该链接已断开）-我不确定angular剑道是否与angular的最新版本兼容（尽管在本演示中，代码甚至不真正依赖angular剑道，因为它是一个单独的指令）实际上@hal9k的答案要简单得多！这应该是正确的答案-最简单且有效。实际上，如果您还需要将id绑定到模型变量，则可以使用：k-data-value-field=“'id'”k-ng-model=“selectedSport”ng model=“sportId”。这样你就拥有了两者——你可以使用你需要的东西。

<select id='date' k-ddl k-data-source="sports" k-data-text-field="name" k-data-item="dataItem">

var app = angular.module('Sample', ['kendo.directives']).directive("kDdl", function () {
    return {
        link: function (scope, element, attrs) {
            $(element).kendoDropDownList({
                dataTextField: attrs.kDataTextField,
                dataValueField: "id",
                dataSource: scope[attrs.kDataSource],
                change: function () {
                    var that = this;
                    var item = that.dataItem();

                    scope.$apply(function () {
                        scope[attrs.kDataItem] = item.toJSON();
                    });
                }
            });
        }
    };
});

function MyController($scope) {
    $scope.sports = [{
        id: 1,
        name: 'Basketball'
    }, {
        id: 2,
        name: 'Football'
    }, {
        id: 3,
        name: 'Tennis'
    }];
    $scope.dataItem = $scope.sports[0];
    $scope.send = function () {
        console.log($scope.dataItem);
    };
}

select: function (e) {
    var item = this.dataItem(e.item.index());
    ...
}

<input id='myDropDownList' kendo-drop-down-list k-ng-model="selectedSport" k-data-source="sports" k-data-text-field="'name'" />

<select kendo-drop-down-list k-select="vm.test" k-data-text-field="'groupName'" k-data-value-field="'id'" k-data-source="vm.groupList" ng-model="vm.groupId"></select>

function DocumentTypeController() {
  var vm = this;
  vm.test = test;
  vm.groupId = null;

  function test(dropdown) {
    alert('text is:' + dropdown.item.text());
  }
}