I'm using the angular bootstrap typeahead directive. Is there a way to select the whole selected object to be set in my ng-model
instead of the string when i utilize typeahead?
e.g.
mycontroller.js
var getStates = function() {
// calls rest service that pulls in states.json from some angular factory
}
var StateCtrl = function ($scope) {
$scope.states = getStates();
$scope.submit = function () {
// Should expect an Object and not the name of the state
console.log($scope.states);
}
}
angular.module('StateCtrl', []).controller(['$scope', StateCtrl]);
states.json
[
// i don't want just state.name i want everything
{name: Alabama, stateCode: 123, salesTax: .06},
{name: Arkansas, stateCode: 122, salesTax: .06},
{name: New York, stateCode: 120, salesTax: .10},
...
]
index.html
<input ng-model="selectedstate" uib-typeahead="state.name for state in states">
<!--- i want selectedState to be {{state}} and not {{state.name}} -->
<button ng-click="submit()">submit</button>
Replace uib-typeahead="state.name for state in states"
with uib-typeahead="state as state.name for state in states"
. This should do the work for you. Here is a working plunker.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With