小编ste*_*jan的帖子

Google商家信息自动填充功能+ Angular2

我正在构建一个简单的Google Places Autocomplete Angular2指令,但问题是无法获得任何预测(响应始终为空？!)...

作为概念证明,我创建了最简单的代码片段作为参考:

<!DOCTYPE html>
<html>

<head>
    <script src="https://maps.googleapis.com/maps/api/js?key=[MY_API_KEY]&libraries=places" async defer></script>
</head>

<body>
    <button type="button" onclick="go()">go</button>
    <input id="autocomplete" type="text"></input>
    <script>
    var autocomplete = null;

    function go() {
        autocomplete = new google.maps.places.Autocomplete(
            (document.getElementById('autocomplete')), {
                types: ['geocode']
            });
    }
    </script>
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

上面的代码有效 - 单击Go按钮后我可以得到预测.

现在,Angular2场景:

我的_Layout.cshtml文件在head部分中有以下标记:

<script src="https://maps.googleapis.com/maps/api/js?key=[MY_API_KEY]&libraries=places" async defer></script>

Run Code Online (Sandbox Code Playgroud)

我的指示:

import { Directive, ElementRef, Input } from '@angular/core';

declare var google: any;

@Directive({ selector: '[googleplaces]' })
export class GooglePlacesDirective {

    autocomplete: any;

    constructor(private el: ElementRef) {

    }

    ngAfterContentInit() …

google-places-api angular

ste*_*jan

lucky-day

8
推荐指数

2
解决办法

9952
查看次数