如何使用 md-autocomplete 在我的 servlet 上获取 ID 值而不是 displayValue？

Question

我已经学习 angularjs 两个星期了。我在技术上陷入了一个简单的问题，但我找不到答案。我试图在我的项目中使用 md-autocomplete 但我被卡住了，因为我想在我的 servlet 中获取 id 值而不是显示值。

有我的 md-autocomplete:

<div ng-controller="DemoCtrl as ctrl" layout="column" ng-cloak>
<md-content class="md-padding">
    <md-autocomplete flex="true" 
                     required="true"
                     md-input-name="autocompleteField" 
                     md-input-minlength="2" 
                     md-input-maxlength="18" 
                     md-no-cache="ctrl.noCache" 
                     md-selected-item="ctrl.selectedItem" 
                     md-search-text="ctrl.searchText" 
                     md-items="item in ctrl.querySearch(ctrl.searchText)" 
                     md-item-text="item.display"
                     md-require-match="true" 
                     md-floating-label="Favorite state">
        <md-item-template>
            <span md-highlight-text="ctrl.searchText" md-highlight-flags="^i">{{item.display}}</span>
        </md-item-template>
        <div ng-messages="formSave.autocompleteField.$error" ng-if="formSave.autocompleteField.$touched || formSave.$submitted">
            <div ng-message="required">You <b>must</b> have a favorite state.</div>
            <div ng-message="md-require-match">Please select an existing state.</div>
            <div ng-message="minlength">Your entry is not long enough.</div>
            <div ng-message="maxlength">Your entry is too long.</div>
        </div>
    </md-autocomplete>
</md-content>

JS:

(function () {
'use strict';
angular
        .module('autocompleteFloatingLabelDemo', ['ngMaterial', 'ngMessages'])
        .controller('DemoCtrl', DemoCtrl);
function DemoCtrl($http, $timeout, $q) {
    var self = this;
    self.states = null;
    self.selectedItem = null;
    self.searchText = null;
    self.querySearch = querySearch;

    function querySearch(query) {
        var deferred = $q.defer();
        $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
        var all;
        $http({
            method: 'GET',
            url: '/employee',
            params: {
                employeeListByName: true,
                active:'active',
                name: query,
                async: false
            }
        }).then(function (response) {
            all = response.data;
            $timeout(function () {
                deferred.resolve(all);
            }, Math.random() * 1000, false);
            deferred.promise;
        }, function () {
            alert('Error');
        });
        return deferred.promise;

    }
}})();

我的自动完成列表

[{"id" : "90", "display" : "Emplooy 1"},{"id" : "66", "display" : "Emplooy 2"}, {"id" : "179", "display" : "Emplooy 3"}, {"id" : "48", "display" : "Emplooy 4"}]

Servlet：

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response){
        String id = request.getParameter("autocompleteField");//the result its the display value, I want to get the id value;
}

有人知道吗？

Answer 1

您的控制器 (selectedItem) 范围内已有所选项目。所以你所要做的就是当你提交表单时，你可以通过

获取 id

selectedItem.id

也许您在表单末尾有一个按钮

<button ng-click="submit()">Click me</button>

然后在你的控制器中

function submit(){
   var id = selectedItem.id;
   //make http call
}

md-autoselect 的文档是：https://material.angularjs.org/latest/api/directive/mdAutocomplete ng-click 的文档是： https://docs.angularjs.org/api/ng/directive/ngClick

如何使用 md-autocomplete 在我的 servlet 上获取 ID 值而不是 displayValue？

How can I get on my servlet the ID value instead the displayValue using md-autocomplete?

servlets

angularjs

md-autocomplete