angularjs – Angular-UI typeahead：显示标签,但绑定到值

发布时间：2020-12-17 08:54:48 所属栏目：安全来源：网络整理

导读：我使用Angular-UI typeahead在以下方式： input type="text" ng-model="myModel" typeahead="o.value as o.text for o in options | filter:$viewValue | limitTo:5" typeahead-editable="false" / 绑定到一个模型像： var options = [ {"value": 1,"text":

我使用Angular-UI typeahead在以下方式：

<input type="text" ng-model="myModel" typeahead="o.value as o.text for o in options | filter:$viewValue | limitTo:5" typeahead-editable="false" />

绑定到一个模型像：

var options = [
    {"value": 1,"text": "value1"},{"value": 2,"text": "value2"},...
];

它正确显示选项文本，但是当我选择一个项目时，它在文本框内显示值。模型正确地绑定到值(而不是整个模型对象)。

是否可以在选择后在文本框内显示“文本”(而不是“值”)，仍然保持模型绑定只是值(即：当我选择一个特定的“文本”模型更新为“值” )？

Thanx

这不是理想的，但是typeahead-input-formatter属性提供了一个解决方法，直到可以提供修复。 ( Plunker从 github螺纹)。

HTML：

<input type="text" ng-model="myModel" typeahead="o.value as o.text for o in options | filter:$viewValue | limitTo:5" typeahead-editable="false" typeahead-input-formatter="formatLabel($model)" />

AngularJs控制器功能：

$scope.formatLabel = function(model) {
   for (var i=0; i< $scope.options.length; i++) {
     if (model === $scope.options[i].value) {
       return $scope.options[i].text;
     }
   }
};

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!