我已经使用Angularjs开发了一个网站，并且运行良好
我有两个相互依赖的自动完成功能；第一个自动完成用于名字，第二个用于姓氏。
我可以同时加载所有选项。
选择或更改名字时，我可以根据绑定到名字数据的方式设置其他变量值
现在，我希望当选择或更改名字时，它将更改姓氏自动完成选择的项目
但是不幸的是，当我更改$ scope变量绑定到它时，所选的姓氏没有改变
我使用错误的方法吗？预先感谢，感谢您的帮助
这是html，名字为
<label class="block-display extra-small-label"><b>First Name *</b></label>
<div ng-controller="DemoCtrlFirstName as ctrlFirstName" layout="column" ng-cloak style="width: 90%;">
<md-content class="md-padding">
<form ng-submit="$event.preventDefault()">
<md-autocomplete
ng-disabled="ctrlFirstName.isDisabled"
md-no-cache="ctrlFirstName.noCache"
md-selected-item="ctrlFirstName.selectedItem"
md-search-text-change="ctrlFirstName.searchTextChange(ctrlFirstName.searchText)"
md-search-text="ctrlFirstName.searchText"
md-selected-item-change="ctrlFirstName.selectedItemChange(item)"
md-items="item in ctrlFirstName.querySearch(ctrlFirstName.searchText)"
md-item-text="item.display"
md-min-length="0"
placeholder=""
class="auto-name"
ng-model="ticket.FirstName" >
<md-item-template>
<span md-highlight-text="ctrlFirstName.searchText" md-highlight-flags="^i">{{item.display}}</span>
</md-item-template>
<md-not-found>
No member matching "{{ctrl.searchText}}" were found.
</md-not-found>
</md-autocomplete>
</form>
</md-content>
</div>
这是html，姓氏
<label class="block-display extra-small-label"><b>Last Name *</b></label>
<div ng-controller="DemoCtrlLastName as ctrlLastName" layout="column" ng-cloak style="width: 90%;">
<md-content class="md-padding">
<form ng-submit="$event.preventDefault()">
<md-autocomplete
ng-disabled="ctrlLastName.isDisabled"
md-no-cache="ctrlLastName.noCache"
md-selected-item="ctrlLastName.selectedItem"
md-search-text-change="ctrlLastName.searchTextChange(ctrlctrlLastName.searchText)"
md-search-text="ctrlLastName.searchText"
md-selected-item-change="ctrlLastName.selectedItemChange(item)"
md-items="item in ctrlLastName.querySearch(ctrlctrlLastName.searchText)"
md-item-text="item.display"
md-min-length="0"
placeholder=""
ng-model="ticket.LastName" >
<md-item-template>
<span md-highlight-text="ctrlLastName.searchText" md-highlight-flags="^i">{{item.display}}</span>
</md-item-template>
<md-not-found>
No member matching "{{ctrlLastName.searchText}}" were found.
</md-not-found>
</md-autocomplete>
</form>
</md-content>
</div>
这是名字的js
$scope.DemoCtrlFirstName = function ($timeout, $q, $log) {
var self = this;
self.simulateQuery = false;
self.isDisabled = false;
// list of `state` value/display objects
self.states = loadAll();
self.querySearch = querySearch;
self.selectedItemChange = selectedItemChange;
self.searchTextChange = searchTextChange;
self.selectedItem = $scope.ticket.FirstName;
self.newState = newState;
function newState(state) {
alert("Sorry! You'll need to create a Constitution for " + state + " first!");
}
// ******************************
// Internal methods
// ******************************
//
// Search for states... use $timeout to simulate
// remote dataservice call.
//
function querySearch (query) {
var results = query ? self.states.filter( createFilterFor(query) ) : self.states,
deferred;
//var deferred;
if (self.simulateQuery) {
deferred = $q.defer();
$timeout(function () { deferred.resolve( results ); }, Math.random() * 1000, false);
return deferred.promise;
} else {
return results;
}
}
function searchTextChange(text) {
//$log.info('Text changed to ' + text);
//$scope.ticket.FirstName = text;
$scope.ticket.FirstName = item.display;
$scope.ticket.LastName = item.last_name;
$scope.ticket.Email = item.email;
$scope.ticket.Mobile = item.mobile;
}
function selectedItemChange(item) {
//$log.info('Item changed to ' + JSON.stringify(item));
$scope.ticket.FirstName = item.display;
$scope.ticket.LastName = item.last_name;
$scope.ticket.Email = item.email;
$scope.ticket.Mobile = item.mobile;
console.log(item.id + " " + $scope.ticket.LastName);
/////////////////////////////////////////////////////////////////////////////////////////
//this line is what I mean to change the last name autocomplete selected value //
/////////////////////////////////////////////////////////////////////////////////////////
$scope.DemoCtrlLastName($timeout, $q, $log).editSelectedItem($scope.ticket.LastName);
//$scope.DemoCtrlLastName($timeout, $q, $log).selectedItem.value = $scope.ticket.LastName;
}
//
// Build `states` list of key/value pairs
//
function loadAll() {
$scope.results= [];
$scope.requestSearch = {
};
$$listing.memberSearchGetRequest($scope.requestSearch).then(function (resultSearch) {
angular.forEach(resultSearch.data.data, function(v, k){
//$scope.ticket.qtyVoucher += value.qty;
$scope.a = [];
$scope.a.value = v.first_name;
$scope.a.display = v.first_name;
$scope.a.id = v.id;
$scope.a.last_name = v.last_name;
$scope.a.email = v.user.email;
$scope.a.mobile = v.user.mobile;
$scope.results.push($scope.a);
//results.push($scope.results);
});
//console.log($scope.results);
//results = $scope.results;
}, function (error) {
$scope.isLoading = true;
console.log(error);
$scope.orderConfirmPostError = error;
toast.show('search is failed');
});
return $scope.results;
}
//
// Create filter function for a query string
//
function createFilterFor(query) {
var lowercaseQuery = query.toLowerCase();
return function filterFn(state) {
console.log(state.value.indexOf(lowercaseQuery) === 0);
return ( (state.value + "").indexOf(lowercaseQuery) === 0);
};
}
}
这是js，姓氏
$scope.DemoCtrlLastName = function ($timeout, $q, $log) {
var self = this;
self.simulateQuery = false;
self.isDisabled = false;
// list of `state` value/display objects
self.states = loadAll();
self.querySearch = querySearch;
self.selectedItemChange = selectedItemChange;
self.searchTextChange = searchTextChange;
//self.selectedItem.value = $scope.ticket.LastName;
//self.selectedItem.display = $scope.ticket.LastName;
self.newState = newState;
function newState(state) {
alert("Sorry! You'll need to create a Constitution for " + state + " first!");
}
// ******************************
// Internal methods
// ******************************
/**
* Search for states... use $timeout to simulate
* remote dataservice call.
*/
function querySearch (query) {
var results = query ? self.states.filter( createFilterFor(query) ) : self.states,
deferred;
if (self.simulateQuery) {
deferred = $q.defer();
$timeout(function () { deferred.resolve( results ); }, Math.random() * 1000, false);
return deferred.promise;
} else {
return results;
}
}
function searchTextChange(text) {
//$log.info('Text changed to ' + text);
//$scope.ticket.FirstName = text;
}
function selectedItemChange(item) {
//$log.info('Item changed to ' + JSON.stringify(item));
$scope.ticket.LastName = item.display;
$scope.ticket.FirstName = item.first_name;
$scope.ticket.Email = item.email;
$scope.ticket.Mobile = item.mobile;
console.log(item.id);
}
/**
* Build `states` list of key/value pairs
*/
function loadAll() {
/*
var allStates = 'Alabama, Alaska, Arizona, Arkansas, California, Colorado, Connecticut, Delaware,\
Florida, Georgia, Hawaii, Idaho, Illinois, Indiana, Iowa, Kansas, Kentucky, Louisiana,\
Maine, Maryland, Massachusetts, Michigan, Minnesota, Mississippi, Missouri, Montana,\
Nebraska, Nevada, New Hampshire, New Jersey, New Mexico, New York, North Carolina,\
North Dakota, Ohio, Oklahoma, Oregon, Pennsylvania, Rhode Island, South Carolina,\
South Dakota, Tennessee, Texas, Utah, Vermont, Virginia, Washington, West Virginia,\
Wisconsin, Wyoming';
allStates = allStates.split(/, +/g).map( function (state) {
return {
value: state.toLowerCase(),
display: state
};
});
console.log(allStates);
return allStates;
*/
$scope.resultsLastName= [];
$scope.requestSearch = {
//"order_token": $scope.createBookingPostDataResult.data.order_token,
//"option": "confirmed",
//"first_name": query
};
$$listing.memberSearchGetRequest($scope.requestSearch).then(function (resultSearch) {
angular.forEach(resultSearch.data.data, function(v, k){
//$scope.ticket.qtyVoucher += value.qty;
$scope.a = [];
$scope.a.value = v.last_name;
$scope.a.display = v.last_name;
$scope.a.id = v.id;
$scope.a.first_name = v.first_name;
$scope.a.email = v.user.email;
$scope.a.phone = v.user.mobile;
$scope.resultsLastName.push($scope.a);
//results.push($scope.results);
});
//console.log($scope.resultsLastName);
//results = $scope.results;
}, function (error) {
$scope.isLoading = true;
console.log(error);
$scope.memberSearchGetError = error;
toast.show('search is failed');
});
return $scope.resultsLastName;
}
/**
* Create filter function for a query string
*/
function createFilterFor(query) {
var lowercaseQuery = query.toLowerCase();
return function filterFn(state) {
return (state.value.indexOf(lowercaseQuery) === 0);
};
}
function editSelectedItem(item) {
//self.selectedItem.value = $scope.ticket.LastName;
//self.selectedItem.display = $scope.ticket.LastName;
self.selectedItem = {
value: $scope.ticket.LastName,
display: $scope.ticket.LastName
};
}
}