Question

我有一个类似的预先输入：

<input type="text" class='tk-proxima-nova degreeIn candidateProfile' placeholder="School / Institution"  ng-model="university" typeahead="university.Service_Provider_Name for university in universitySuggest($viewValue)" />

它返回类似于此的JSON：

[{"Service_Provider_ID":133368,"Service_Provider_Name":"Duke University","Service_Provider_Desc":null,"NAICS_Id":1809},{"Service_Provider_ID":196282,"Service_Provider_Name":"Duke University Medical Center","Service_Provider_Desc":null,"NAICS_Id":1809},{"Service_Provider_ID":222220,"Service_Provider_Name":"Duke University Psychology Internship","Service_Provider_Desc":null,"NAICS_Id":1809},{"Service_Provider_ID":223427,"Service_Provider_Name":"Duke University Medical Center Psychology Internship","Service_Provider_Desc":null,"NAICS_Id":1809}]

当我从typeahead中选择选项时，它会将学校名称放在字段中，但是还有一种方法可以将id设置为另一个隐藏输入，这样我也可以使用我选择的数据发送它。 ID在这里很重要，但需要提供名称才能查看。

Answer 1

是的，您可以执行以下操作：

<input type="text"
  ng-model="selected"
  typeahead-on-select="changeSelect($item)"
  typeahead="university as university.Service_Provider_Name for university in universities | filter:{Service_Provider_Name:$viewValue} " />

这是 Plunkr

为了更清晰，我稍微缩进了代码。

Answer 2

除了Apercu上面提到的关于typeahead =＆＃34; ...＆＃34;的格式的评论。，你需要有一个像这样的

  typeahead-input-formatter="univChosen($model)"

  $scope.univChosen = function(theId) {
         var theItem = jQuery.grep($scope.universities,function(p) {
                                return p.Service_Provider_ID == theId});
    return theItem[0].Service_Provider_Name;
  };

我假设$ scope.universities包含typeahead选项中所有项目的完整列表。我在这里使用jQuery来查找匹配的项目，但如果你愿意，你可以只做一个for（...）循环。该函数返回实际显示的字符串，在本例中为名称。

无法在自动完成时从JSON获取ID

2 个答案: