Change selected value in md-autocomplete in angular material - angularjs

Question

I using md-autocomplete in my page, Now I need to edit a record, how to change selected value in md-autocomplete programmatically?
This is angular code:
app.controller('DemoCtrl', DemoCtrl);
function DemoCtrl($timeout, $q, $log) {
var self = this;
self.simulateQuery = false;
self.isDisabled = false;
self.states = loadAll();
self.querySearch = querySearch;
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 createFilterFor(query) {
var lowercaseQuery = angular.lowercase(query);
return function filterFn(state) {
return (state.value.indexOf(lowercaseQuery) != -1);
};
}
function loadAll() {
return totlaTablaeau.map(function (repo) {
repo.value = repo.address.toLowerCase();
return repo;
});
}
};

Answer 1

Here's a CodePen using the online docs example. You just need to set the value of md-selected-item.
Markup
<md-autocomplete ... md-selected-item="ctrl.selectedItem" ...></md-autocomplete>
...
<md-button class="md-raised md-primary" ng-click="ctrl.selectArkansas()">Select Arkansas</md-button>
JS
self.selectArkansas = function() {
self.selectedItem = {
value: "Arkansas".toLowerCase(),
display: "Arkansas"
};
}

Answer 2

Your Html template looks like this.
<md-autocomplete
md-selected-item="model"
md-search-text="search_text"
md-items="item in searchResults()"
md-item-text="item.title"
md-min-length="3"
md-floating-label="Your Label"
placeholder="placeholder"
>
<md-item-template>
<span> {{item.title}},{{item.name}}</span>
</md-item-template>
<md-not-found>
No matches found.
</md-not-found>
</md-autocomplete>
Your controller code
class Controller {
constructor($service) {
this.$service = $service;
}
//we are init the varible hare.
$onInit() {
this.search_text = "";
//set by defaut value in you auto complete.
this.model = {id:'0000',title:'defalt',name:'Your Name'};
}
}
//function for get data list
// $service this is service function we can define in over services file and we can inject this way
searchResults() {
let { $service, search_text } = this;
return $service.search(search_text).then((data) =>data.list).catch(err =>{ });
}
//Responce data look like this
//[{id:'00h1',title:'test1',name:'harish verma'},
//{id:'00h2',title:'test1',name:'harish verma'},
//{id:'00h3',title:'test1',name:'harish verma'},
//{id:'00h4',title:'test1',name:'harish verma'}];
}
Controller.$inject = [
"Service"
];
export default Controller;
set by defaut value in you auto complete.
this.model = {id:'0000',title:'defalt',name:'Your Name'};