Question

我是angularJs / coffeescript的新手，并试图将其与谷歌地图整合。

目标，是在使用getPlace（）自动完成后获取place_id，并将其存储在安全的地方，方法是将其传递给服务方法，以便以后可以保存。

这是代码

coffeecode

class SomeController

constructor: (@$scope, @$log, @$location, @SomeService) ->

    @listing = {}


    getPlace: (place) ->
          place = @getPlace()
          alert(place.place_id)
          return place

    doSomethingMore: () ->

          @variable.whereGeo =  @getPlace().place_id
          alert(@listing.whereGeo)

    @SomeService.someFunction(@listing)  //save the place id somewhere 

controllersModule.controller('SomeController', SomeController)

HTML

<div ng-controller="SomeController as sc">

<div class="col-sm-3">
            <input places-auto-complete type="text" class="form-control" name="where" id="where" placeholder=""
                   ng-model="sc.search.where"  on-place-changed="sc.getPlace(place)">
        </div>

        <div ng-show= "sc.place.length">
            <p>Ideally something should Appear here after autocomplete </p>
            place_id = {{ sc.place }} <br/>

        </div>
<div class="col-sm-offset-4 col-sm-2 col-xs-1 text-right">
                <button ng-click="sc.doSomethingMore()" class="btn btn-success btn-lg" id="btn_create">Submit</button>
            </div>
 </div>

现在使用的模块是 ngMap 。这是链接 angular-google-maps

现在让我添加细节和问题。

自动填充功能正常
getPlace函数被调用
使用place_id按预期抛出警报。但是，我不将数据恢复到sc.place
按下提交后，我收到错误this.getPlace 未定义。

我尝试过的事情。我用过fat arrow =＆gt;在getPlace中得到this.getPlace是未定义的错误，并且在调用getPlace时也不会抛出警报。

尝试查找here和here并做了解决方案，但没有让它发挥作用。另外this对了解情景非常有用，但没有帮助

对此有任何帮助，我们非常感谢。提前谢谢。

Answer 1

好的..所以我做错了。经过一番研究发现了这个。我的范围都错了。最后的解释。

的CoffeeScript

class SomeController

constructor: (@$scope, @$log, @$location, @SomeService) ->

@listing = {}
@place
    autocomplete_options = {
      types: ['geocode'] 
    }

    autocomplete = new google.maps.places.Autocomplete(document.getElementById('where'), autocomplete_options)

    google.maps.event.addListener autocomplete, 'place_changed', =>
        place = autocomplete.getPlace()
        console.log(place.place_id)
        @$scope.$apply =>
            @$scope.place = place.place_id




doSomethingMore: () ->

      @liating.whereGeo =  @$scope.place // now place id is available in scope 
      alert(@listing.whereGeo)

@SomeService.someFunction(@listing)  //save the place id somewhere 

controllersModule.controller('SomeController', SomeController)

HTML

<div ng-controller="SomeController as sc">

<div class="col-sm-3">
            <input type="text" class="form-control" name="where" id="where" placeholder=""
                   ng-model="sc.search.where">
        </div>


<div class="col-sm-offset-4 col-sm-2 col-xs-1 text-right">
                <button ng-click="sc.doSomethingMore()" class="btn btn-success btn-lg" id="btn_create">Submit</button>
            </div>
 </div>

解释

对于必须实现的目标，必须将place_id分配给a 全局变量然后在整个范围内可用。
=＆gt;之间的差异和 - ＆gt;在coffescript中必须记住。我找到了一些好的文档here
最后this回答很有帮助

使用coffeescript

1 个答案: