Googleマップのオートコンプリートは入力スロット結果のみの市名ではなく、完全な住所

Question

良い一日、

私は2つの入力スロットがあるフォーム作っています取得するには：「出発都市」と「宛先市」

を私は（私がいない実行される）そのソリューションを使用して、私はそれが角度ソリューションであると思います - http://plnkr.co/edit/il2J8qOI2Dr7Ik1KHRm8?p=preview

<input type="text" id="Autocomplete" class="form-control" ng-autocomplete="result2" details="details2" options="options2"/> 

angular.module("Test", ['ngAutocomplete']) 
    .controller("TestCtrl",function ($scope) { 

    $scope.result2 = ''; 
    $scope.options2 = { 
     country: 'us', 
     types: '(cities)' 
    }; $scope.details2 = ''; 
    }); 

が、問題がある - 私たちはダラスを入力し始めると、我々は、Googleの提案「米ダラス、TXを、得ました「状態」を選択し、それを確認するためにクリックすると、入力は「Dall as、TX、United States "と入力するだけで、結果として" Dallas "が必要になります。例えば

： 1）私たちは「ドール」と入力し始めると、我々はGoogleの 3によって提案のリストを得た）ダラス 2として出発市を必要とする）私たちは第一1をクリックして - ダラス、TX、米国をそして 4）当社の入力スロットに、我々は「ダラス」を得たが、ありません「ダラス、TX、米国」今、そのサービスの現在の状態では

本当に私はそれを作るために、そのソリューション（http://plnkr.co/edit/il2J8qOI2Dr7Ik1KHRm8?p=preview）を更新する方法を取得いけないと私のやり方で働いている。

Answer 1

getPlace()戻り、この構造：

{"address_components":[{"long_name":"Dallas","short_name":"Dallas","types":["locality","political"]},{"long_name":"Dallas County","short_name":"Dallas County","types":["administrative_area_level_2","political"]},{"long_name":"Texas","short_name":"TX","types":["administrative_area_level_1","political"]},{"long_name":"United States","short_name":"US","types":["country","political"]}],"adr_address":"<span class=\"locality\">Dallas</span>, <span class=\"region\">TX</span>, <span class=\"country-name\">USA</span>","formatted_address":"Dallas, TX, USA","geometry":{"location":{"lat":32.7766642,"lng":-96.79698789999998},"viewport":{"south":32.617537,"west":-96.99894130000001,"north":33.0237921,"east":-96.46373790000001}},"icon":"https://maps.gstatic.com/mapfiles/place_api/icons/geocode-71.png","id":"fa589a36153613fc17b0ebaebbea7c1e31ca62f0","name":"Dallas","photos":[{"height":2322,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/103240547556009569847/photos\">Robert Rogers</a>"],"width":4128},{"height":728,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/103202508011395907641/photos\">Blake Margolis RowlettSachseScanner</a>"],"width":1440},{"height":1579,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/110350056655658805900/photos\">Ramil Soy</a>"],"width":2807},{"height":2366,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/111265500346815453367/photos\">Wolfgang Demino</a>"],"width":3619},{"height":4387,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/103960188949347184478/photos\">Thang Tran</a>"],"width":6000},{"height":2304,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/117980955401126505428/photos\">Nymisha Bandi</a>"],"width":4096},{"height":2221,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/113732984326979786649/photos\">Volkan Yuksel</a>"],"width":5692},{"height":665,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/101875825735695083663/photos\">Accounting Department</a>"],"width":1000},{"height":3519,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/102844598608092286357/photos\">LCP360 Production</a>"],"width":5760},{"height":1152,"html_attributions":["<a href=\"https://maps.google.com/maps/contrib/105626597651962458040/photos\">K. Osgood</a>"],"width":2048}],"place_id":"ChIJS5dFe_cZTIYRj2dH9qSb7Lk","reference":"CnRsAAAAd4lD76ntfuCVsOakSCHjeWZEdxuVIKsnv86z3u9Fq1A12QTRvj6SSS4O4ZE9Apvq_wWT8r4ux3lT8FDvIDD6EWNKHiUVyhhxw-1yMClXawE20mV8_xPGXz2UKPoKSSbZmqH1rzlIqVTuOeKMt_5OBRIQLtW-4AspRKSG4Mv_fEbrERoUrJyRcYEoY4CbwPyC77PXO70_1_c","scope":"GOOGLE","types":["locality","political"],"url":"https://maps.google.com/?q=Dallas,+TX,+USA&ftid=0x864c19f77b45974b:0xb9ec9ba4f647678f","utc_offset":-300,"vicinity":"Dallas","html_attributions":[]} 

だから我々は簡単にあなたが望む結果を得るために詳細を解析できます。

たとえば、短い名前のみを示す元のサンプルのフォークを確認します。 http://plnkr.co/edit/6egntT9xl4eZVJg6HoWj?p=preview

次に、要素の値を結果の代わりに.nameに設定します。

Plunkerは、私はちょうどオートコンプリートサービスからフォーマットされた文字列にテキストボックスを設定した行をコメントアウトnewAutoComplete機能で

編集

を更新しました。

//scope.ngAutocomplete = element.val(); // the formatted string is in the text box. 
scope.ngAutocomplete = scope.details.name; // we just want the name field. 
element[0].value = scope.details.name; // you could use other parts of the object above if need be. 

Answer 2

corn3liusありがとう。今それは私が必要とするようにexacltly動作します！あなたは何が問題なのか、そしてPlunkerで更新したことがそのように働くことを説明できますか？