gpt4 book ai didi

javascript - 使用 ng-autocomplete 时默认值未预填充输入字段

转载 作者:行者123 更新时间:2023-12-03 07:33:37 25 4
gpt4 key购买 nike

我正在使用 ng-init 在我的输入字段中获取一些默认值。它工作正常。但是,当我将 ng-autocomplete 添加到输入字段时,默认值不再显示在输入字段中。

index.html

    <!DOCTYPE html>
<html ng-app=testApp>

<head>
<link rel="stylesheet" href="style.css">
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.js"></script>
<script src="script.js"></script>
<script src="ngAutocomplete.js"></script>
</head>

<body>
<div ng-controller="searchCtrl" ng-init="roomsInit('london')">
<input type="text" ng-autocomplete ng-model="searchLocation" class="form-control input-lg" options="locationFilter">
</div>

</body>

</html>

脚本.js

app = angular.module("testApp", ['ngAutocomplete']);

app.controller('searchCtrl', function ($scope, $http) {


$scope.locationFilter = {
country: 'uk',
types: '(cities)'
}; $scope.details2 = '';



$scope.roomsInit = function (location) {
$scope.searchLocation = location;

//below code is not relevant to this case
$http({
url: "/search.json",
method: "GET",
params: {location: $scope.searchLocation,
q: {
daily_price_gteq: $scope.min_price,
daily_price_lteq: $scope.max_price,
room_type_eq_any: [$scope.private, $scope.entire, $scope.shared]
}
},
paramSerializer: '$httpParamSerializerJQLike'
}).success(function (response) {
$scope.rooms = response.rooms;

});
};

});

如果我删除 ng-autocomplete ,它就可以正常工作。有人可以看一下吗 Here is the plunker

最佳答案

您使用的指令不支持 ng-model,需要您将模型传递给 ng-autocomplete:

<input type="text" ng-autocomplete="result" details="details" class="form-control input-lg"  options="locationFilter">

当您在框中键入内容时,这会运行自动完成功能。

我相信您要执行的指令是:https://github.com/wpalahnuk/ngAutocomplete/blob/master/src/ngAutocomplete.js

更新
您正在使用的指令有一个监视程序,它会在第一次运行后清除该值:

scope.$watch(scope.watchOptions, function () {
initOpts()
newAutocomplete()
element[0].value = ''; // <-- This resets the value
scope.ngAutocomplete = element.val();
}, true);

如果您不关心修改指令,请将其更改为:

scope.$watch(scope.watchOptions, function (newValue, oldValue) {
if (newValue !== oldValue) {
initOpts()
newAutocomplete()
element[0].value = '';
scope.ngAutocomplete = element.val();
}
}, true);

这会阻止它清除该值,除非您更改 options/locationFilter

关于javascript - 使用 ng-autocomplete 时默认值未预填充输入字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35709244/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com