Jqueryクリック後に入力ボックスにオートコンプリートがあります

Question

複数の入力に対してオートコンプリートを使用しようとしています。ボタンをクリックすると、すべての入力が表示されます。私はクラスを使ってやろうとしています。

<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機能をクリックするとコード - 私のコントローラである：ここで はHTMLです。これはプロジェクトの配列を塗りつぶし、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-あなたは、同じクラス

<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としてhtmlコード内の複数の入力を取らなければならない - それからの要素を動的にDOMに追加されているの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); 
       }