在select匹配上使用angular ui-bootstrap typeaheadcallback？

我正在使用angular ui-bootstrap typeahead，我想用它来获取很多select，所以我需要在selectMatch方法启动时获取选定的值，但是我找不到如何执行在我的控制器

<div class='container-fluid' ng-controller="TypeaheadCtrl"> <pre>Model: {{selected| json}}</pre> <input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue"> 

如果我看着选定的值，每当按下一个键时我都会得到改变。

 scope.$watch('selected', function(newValue, oldValue) {... }); 

我得到的方法selectMatch是当用户按下input或点击列表时调用的，但我不知道如何有一个callback… …

谢谢 ！

Answer 1

现在有更好的办法。 新的callback方法已被添加

在控制器文件中添加以下内容：

  $scope.onSelect = function ($item, $model, $label) { $scope.$item = $item; $scope.$model = $model; $scope.$label = $label; }; 

鉴于添加以下内容：

  <input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue" typeahead-editable="false" typeahead-on-select="onSelect($item, $model, $label)"/> 

有关更多信息，请参见typeahead规范 （searchonSelect）。

看看以下url是否有助于http://www.techguides.in/how-to-create-autocomplete-using-angularjs-ui/

http://www.techguides.in/how-to-customize-autocomplete-to-display-multiple-columns-using-angularjs-ui-2/

Answer 2

编辑：这个方法现在不是最好的。 最好使用onSelectcallback，就像上面这个回答中所解释的那样。

我发现怎么做才能做到我想要的。 我确实看到有一个typehead-editable属性，如果它被设置为false，那么只有当select了模型中的一个值时，所select的值才会改变。 所以$ watch正在工作正常，以检查什么时候select一个新的值。

 <input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue" typeahead-editable="false"> link: function(scope, elm, attrs){ scope.$watch('selected', function(newValue, oldValue) { if (newValue) console.log(oldValue+"->"+newValue); }); } 

Answer 3

以下应该是你的HTML

  <input id="title" type="text" ng-model="title" typeahead="data.enquiry_title for data in titleData | filter:$viewValue | limitTo:8" typeahead-on-select='onSelect($item, $model, $label)' /> 

只需在callback函数中添加input标记中的typeahead-on-select 。

以下将进入控制器

 $scope.onSelect = function ($item, $model, $label) { console.log($item); if($item.tid) $scope.activeTitleId = $item.tid }; 

在$ item里面，你会得到你已经在build议列表的主数组中传递的整个对象

Answer 4

validation前请尝试以下内容

  modelCtrl.$setValidity('editable', true);