自动完成角js不工作
问题描述:
我想实现角js输入文本字段的自动提示框。 我用以下提琴的参考http://jsfiddle.net/sebmade/swfjT/light/自动完成角js不工作
我试过的是在前端。
<input type="text" auto-complete ui-items="suggestionPhrase" id="ingredients" ng-model="searchString" ng-change="callSuggestion()" ng-enter="getRecipesTracknPlan()" placeholder="Type of ingredients/recipe">
和js文件是
var app = angular.module('tracknplanApp', ['checklist-model','ui.bootstrap','ui.utils']);`enter code here`app.config(['$locationProvider',
function ($locationProvider)
{
$locationProvider.html5Mode(true); }]);
app.controller('tracknplanctrl', function ($scope, $http, $location, searchStringSelected, $modal, $filter) {
console.log("Running Track n plan controller.");
/*angular.element('#recipeNVariantTabs').removeClass('hidden-xs');
angular.element('#recipeNVariantTabs').removeClass('hidden-sm');*/
$scope.showVariants = false;
var trackNPlanDate = new Date();
var foodSearchDate = new Date();
var activitySearchDate = new Date();
$scope.callSuggestion= function(){
if ($scope.searchString){
console.log("inside initializeFoodSuggestion",$scope.searchString);
angular.element.ajax({
url: "http://dev2.slim.in:8983/solr/food/suggest",
data: {
"q": $scope.searchString,
"wt": "json",
"spellcheck": "true",
"spellcheck.build": "true"
},
traditional: true,
cache: true,
async: true,
dataType: 'jsonp',
success: function (data) {
//and when we get the query back we
//stick the results in the scope
$scope.$apply(function() {
$scope.suggestionPhrase = data.spellcheck.suggestions[1].suggestion;
console.log("suggestion from solr is ",$scope.suggestionPhrase)
});
},
jsonp: 'json.wrf'
});
}}
app.directive('autoComplete', function() {
return function(scope, iElement, iAttrs) {
iElement.autocomplete({
source: $scope.suggestionPhrase,
select: function() {
$timeout(function() {
iElement.trigger('input');
}, 0);
}
});
};});
我不知道在我的代码都错了,请指出这个错误。
答
我没有发现该指令工作,所以我得到了jQuery自动完成
$("#ingredients").autocomplete({
source:function(request, response) {
angular.element.ajax({
url: "http://dev2.slim.in:8983/solr/food/suggest",
data: {
"q": $scope.searchString,
"wt": "json",
"spellcheck": "true",
"spellcheck.build": "true"
},
traditional: true,
cache: true,
async: true,
dataType: 'jsonp',
success: function (data) {
//and when we get the query back we
//stick the results in the scope
$scope.$apply(function() {
$scope.suggestionPhrase = data.spellcheck.suggestions[1].suggestion;
console.log("before suggestprint")
console.log("suggestion from solr is ",$scope.suggestionPhrase)
response($scope.suggestionPhrase);
});
},
jsonp: 'json.wrf'
});} });
你能为你的代码编写小提琴? – Ankita
是肯定的一秒 –
对不起,我不知道如何做到这一点,请从上面的代码自己找到错误它自己 –