Question

我正面临一个问题。我正在使用谷歌地图api地址自动填充。当我运行谷歌提供的示例代码时它工作正常。但是当我在我的应用程序中使用它它适用于小输入，如小国家，城市名称。但是，当我使用它进行长输入时，它在控制台上给出了这个错误。

new:1381 Uncaught TypeError: Cannot read property 'length' of undefined

当我点击链接时，它会带我到这段代码。

for (var i = 0; i < place.address_components.length; i++) {
        var addressType = place.address_components[i].types[0];
        if (componentForm[addressType]) {
            var val = place.address_components[i][componentForm[addressType]];
            var valShort  =place.address_components[i].short_name;
            document.getElementById(addressType).value = val;
        }
    }

以下是代码：

<script>

    var placeSearch, autocomplete;
    var componentForm = { 

        locality: 'long_name',
        administrative_area_level_1: 'long_name',
        country: 'long_name',    
    };    

    function initAutocomplete() {
        // Create the autocomplete object, restricting the search to geographical
        // location types.
        autocomplete = new google.maps.places.Autocomplete(
                /** @type {!HTMLInputElement} */(document.getElementById('autocomplete')),
                {types: ['geocode']});

        // When the user selects an address from the dropdown, populate the address
        // fields in the form.
        autocomplete.addListener('place_changed', fillInAddress);
    }

    function fillInAddress() {
        // Get the place details from the autocomplete object.
        var place = autocomplete.getPlace();

        for (var component in componentForm) {
            document.getElementById(component).value = '';
            document.getElementById(component).disabled = false;
        }

        // Get each component of the address from the place details
        // and fill the corresponding field on the form.
        for (var i = 0; i < place.address_components.length; i++) {
            var addressType = place.address_components[i].types[0];
            if (componentForm[addressType]) {

                var val = place.address_components[i][componentForm[addressType]];
                var valShort  =place.address_components[i].short_name;
                document.getElementById(addressType).value = val;
            }
        }
    }  

</script>

Answer 1

您需要检查address_components是否存在。

根据Autocomplete class参考：

如果用户输入了未建议的地方名称控制并按Enter键，或者如果Place详细信息请求失败，将触发包含用户输入的place_changed事件 name属性，没有定义其他属性。

所以你需要在事件被触发时处理这个案例，但你得到的地方只有一个名字。解决此问题的一种方法是回退发送Geocoding或Place Text Search请求。对地址进行地理编码已足够，但如果您还想查找商家，则需要使用地点文字搜索。

Google地图地址自动填充错误：无法读取属性＆＃39;长度＆＃39;未定义的

1 个答案: