在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… …

谢谢 !

现在有更好的办法。 新的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/

编辑:这个方法现在不是最好的。 最好使用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); }); } 

以下应该是你的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议列表的主数组中传递的整个对象

validation前请尝试以下内容

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