5

Angular UI の先行入力を使用しようとしています。私の問題は、ドロップダウンが表示されないことです。リモートデータが正しく呼び出され、データが返されています...しかし、ドロップダウンは表示を拒否しています...

<td colspan="5">
   <pre>Model: {{selected| json}}</pre>
   <input id="AutoCompleteDebtor" 
          type="text" 
          data-ng-model="selected" 
          data-typeahead="debtor for debtor in Debtors($viewValue)" 
          class="form-control input-sm" 
          placeholder="Enter 3 letters of Debtor Name" />
</td>

更新: わかりました-文字列名の配列ではうまく機能しますが、オブジェクトではどうすればよいですか?

<!DOCTYPE html>
<html data-ng-app="myApp">
<head>
<title>Angular Typeahead</title>
<link href="Content/bootstrap/bootstrap.min.css" rel="stylesheet" />
<script src="Scripts/angular.min.js"></script>
<script src="Scripts/ui-bootstrap-tpls-0.6.0.min.js"></script>
<script>
    angular.module('myApp', ['ui.bootstrap'])
    .controller('SimpleController', function ($scope) {
        $scope.people = [
            { name: 'Alan', age: 23 },
            { name: 'Bruce', age: 24 },
            { name: 'Celine', age: 53 },
            { name: 'Dan', age: 43 },
            { name: 'Eric', age: 23 },
            { name: 'Freda', age: 47 },
            { name: 'Greg', age: 73 },
            { name: 'Hanna', age: 27 }
        ];
    });
</script>

</head>
<body data-ng-controller="SimpleController">
<div>
    <pre>Model: {{selected| json}}</pre>
    <input type="text" data-ng-model="selected" data-typeahead="name for name in people | filter:$viewValue | limitTo:8">
</div>
</body>
</html>

https://github.com/angular-ui/bootstrap/tree/master/src/typeaheadの例に従っています

4

2 に答える 2

0

グレッグの答えからタイプアヘッドを解決しました。これが私がタイプアヘッドのためにしたことです（これが誰かに役立つことを願っています）：

typeahead="i.t_UserName for i in employeeInfo | filter:$viewValue | limitTo:4" あなたのhtml入力の属性として行きます

およびコントローラーで（従業員リソースを使用）

$scope.employeeInfo = getEmployeeResourceSvc.getEmplInfo.query(function(response){
          $scope.employeeInfo= response;
});
于 2014-03-10T15:55:19.537 に答える