我们创建了pluncker:http://plnkr.co/edit/dgjHsKQLVPpacfGpQCUQ?p=preview,我们已经实现了typeahead控件。
问题在步骤中解释: -
但我们无法使用上下键遍历列表。
angular.module('autosearch', []);
angular.module('autosearch').controller('TypeaheadCtrl', function($scope, $http) {
$scope.search= {}
console.log('hiiii');
}).directive('searchItems', ['$document', function($document) {
return {
restrict: 'E',
scope: {
search: '=ngModel'
},
templateUrl: 'auto-search.html',
link: function(scope, elem, attr) {
console.log('fghfgh');
scope.product = {};
scope.quantity = 10;
scope.categoryQuantity = 7;
scope.setCurrent = function(product) {
return scope.categories = product.category;
};
scope.search.searchItems = function() {
scope.showList = true;
scope.items = [
{
"id": "99",
"name": "Apricot Kernels",
"category": []
}, {
"id": "136",
"name": "Apparel",
"category": [
{
"name": "Coats",
"id": 156
}, {
"name": "Dresses",
"id": 157
}, {
"name": "Ethnic Clothing",
"id": 165
}, {
{
"name": "Mannequins",
"id": 224
}, {
"name": "Maternity Clothing",
"id": 225
}, {
"name": "Men's Shirts",
"id": 226
}, {
"name": "Other Apparel",
"id": 227
}, {
"name": "Pants \u0026 Trousers",
"id": 228
},{
"name": "Wedding Apparel \u0026 Accessories",
"id": 296
}, {
"name": "Work Wear",
"id": 302
}
]
}, {
"id": "139",
"name": "Apparel Stock",
"category": []
}, {
"id": "1999",
"name": "Apparel Accessories Machinery",
"category": [
{
"name": "Cap Making Machinery",
"id": 2000
}, {
"name": "Gloves Making Machinery",
"id": 2001
}, {
, {
"name": "Sock Knitting Machinery",
"id": 2005
}
]
}, {
"id": "138",
"name": "Apparel Processing Services",
"category": []
}, {
"id": "1990",
"name": "Apparel \u0026 Textile Machinery Parts",
"category": [
{
"name": "Apparel Machinery Parts",
"id": 1991
}, {
{
"name": "Sock Knitting Machinery Parts",
"id": 1997
}, {
"name": "Textile Machinery Parts",
"id": 1998
}
]
}, {
"id": "1990",
"name": "Parts",
"category": [
{
"name": "Apparel Machinery Parts",
"id": 1991
}, {
"name": "Cap Making Machinery Parts",
"id": 1992
}, {
"name": "Glove Making Machinery Parts",
"id": 1993
}, {
"name": "Sock Knitting Machinery Parts",
"id": 1997
}, {
"name": "Textile Machinery Parts",
"id": 1998
}
]
}, {
"id": "1990",
"name": "Machinery Parts",
"category": [
{
"name": "Apparel Machinery Parts",
"id": 1991
}, {
"name": "Cap Making Machinery Parts",
"id": 1992
}, {
"name": "Glove Making Machinery Parts",
"id": 1993
, {
"name": "Sock Knitting Machinery Parts",
"id": 1997
}, {
"name": "Textile Machinery Parts",
"id": 1998
}
]
}, {
"id": "1990",
"name": "Textile Machinery Parts",
"category": [
{
"name": "Machinery Parts",
"id": 1991
}, {
"name": "Cap Making Machinery Parts",
"id": 1992
}, {
"name": "Glove Making Machinery Parts",
"id": 1993
}, {
"name": "Home Textile Product Machinery Parts",
"id": 1994
}, {
"name": "Leather Production Machinery Parts",
"id": 1995
}, {
"name": "Shoemaking Machinery Parts",
"id": 1996
}, {
"name": "Sock Knitting Machinery Parts",
"id": 1997
}, {
"name": "Textile Machinery Parts",
"id": 1998
}
]
}, {
"id": "136",
"name": "Apparel",
"category": [
{
"name": "Apparel Design Services",
"id": 137
}, {
"name": "Apparel Processing Services",
"id": 138
, {
"name": "Garment Accessories",
"id": 171
}, {
"name": "Hoodies \u0026 Sweatshirts",
"id": 198
}, {
"name": "Hosiery",
"id": 199
}, {
"name": "Infant \u0026 Toddlers Clothing",
"id": 205
}, {
"name": "Jackets",
"id": 221
}, {
"name": "Jeans",
"id": 222
}, {
"name": "Ladies Blouses \u0026 Tops",
"id": 223
}, {
"name": "Mannequins",
"id": 224
}, {
"name": "Maternity Clothing",
"id": 225
}, {
"name": "Men's Shirts",
"id": 226
}, {
"name": "Other Apparel",
"id": 227
}, {
"name": "Pants \u0026 Trousers",
"id": 228
}, {
"name": "Sewing Supplies",
"id": 229
}, {
"name": "Shorts",
"id": 234
}, {
"name": "Skirts",
"id": 235
}, {
"name": "Sleepwear",
"id": 236
}, {
"name": "Sportswear",
{
"name": "Used Clothes",
"id": 294
}, {
"name": "Vests \u0026 Waistcoats",
"id": 295
}, {
"name": "Wedding Apparel \u0026 Accessories",
"id": 296
}, {
"name": "Work Wear",
"id": 302
}
]
}
];
console.log(scope.items, 'itwe,sss');
};
}
}
}]);