AngularJS中的多个输入的Google地址自动完成功能

时间:2018-10-11 08:44:20

标签: javascript angularjs google-maps-api-2

我正在努力在angularJS的ng-repeat内实现Google地址自动完成功能。

我有一个ng-repeat循环来打印一些HTML。

<table>           
    <thead>
        <tr>
            <th>Street</th>
            <th>City</th>
            <th>State</th>
            <th>Zip</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="location in assetLocations track by $index">          
            <td>
                <input type="text" class="street_edit_group form-control" ng-model="location.Street__c" id="{{$index}}">    
            </td>
            <td>
                <input type="text" class="form-control" ng-model="location.City__c">    
            </td>
            <td>
                <input type="text" class="form-control" ng-model="location.State__c">
            <td>
                <input type="text" class="form-control" ng-model="location.Zip__c">    
            </td>
        </tr>
    </tbody>
</table>

我想在street_edit_group类中为每个输入实现Google地址自动完成功能。

<input type="text" class="street_edit_group form-control" ng-model="location.Street__c" id="{{$index}}">

为此,我在Controller中所做的是

$scope.autocompleteAssetLocationEdit = null;

 $scope.initialize = function() {
            var clsname = document.getElementsByClassName('street_edit_group');

            for (var i = 0; i < clsname.length; i++) {
                var id = clsname[i].id;
                $scope.autocompleteAssetLocationEdit = new google.maps.places.Autocomplete(

                (document.getElementById(id)), {
                    types: ['geocode']
                });

                $scope.autocompleteAssetLocationEdit.addListener('place_changed', function () { $scope.fillInEditAddress() });
            }
  };

$scope.fillInEditAddress()中,我有

    $scope.fillInEditAddress = function(){
                    var streetNumber = '';
                    var street = '';
                    var city = '';
                    var stateCode = '';
                    var zipCode = '';

                    var place = $scope.autocompleteAssetLocationEdit.getPlace();
                    console.log(place);
};

但是,$scope.autocompleteAssetLocationEdit.getPlace();并没有在那里获取任何地方。

我的代码有什么问题?

0 个答案:

没有答案