Question

我正在尝试在多个输入上使用自动完成功能。单击按钮时，所有输入都会显示。我正在尝试使用课程。这是HTML：

<div layout = "row" ng-repeat="project in projects">    
    <div layout = "column" layout-align="center center" flex="33">
        <md-input-container>
            <label>Project Name</label>
                <input class="autoc" type="text" placeholder="{{project.id}}" ng-keyup="myFunct($event)">
        </md-input-container>
    </div>  
</div>

这是我的控制器代码 - 单击按钮时，将调用setCity函数。它填充了项目数组，并在其中编写了jquery代码。

$scope.items = ['item1', 'item2', 'item3'];

$scope.setCity =function(cityname) {
    $scope.projects = [];
    for (var key in $scope.list) {
        if ($scope.list[key].city == cityname.toLowerCase()) {
            $scope.projects.push($scope.list[key]);
        }
    }

    $( ".autoc").autocomplete({
        autoFocus: true,
        source: $scope.items
    });

};

自动填充功能不适用于输入框。其他建议也欢迎。提前谢谢！

Answer 1

1-你必须将html代码中的多个输入作为同一个类

    <div ng-app='MyModule'>
    <div ng-controller='DefaultCtrl'>
        <input auto-complete ui-items="names" ng-model="selected">
        <input auto-complete ui-items="names" ng-model="selected">
        selected = {{selected}}
    </div>
</div>

2 - 然后使用Js代码

angular.module('MyModule', []).directive('autoComplete', function($timeout) {
    return function(scope, iElement, iAttrs) {
            iElement.autocomplete({
                source: scope[iAttrs.uiItems],
                select: function() {
                    $timeout(function() {
                      iElement.trigger('input');
                    }, 0);
                }

单击后，在输入框上自动完成Jquery

1 个答案: