Scope变量没有设置 [英] Scope variable doesn't set

问题描述

我得到了地址自动完成指令，并得到地方的信息。此外，我已经添加了一个code获取城市ID和code在我过去的一个项目工作，但现在不工作（[0] code .place_id的数据有一个正确的值，但scope.form.object.localityId是空之外的功能。

PS scope.form.object ......在指令和其他变量的父控制器声明的正确填写

  .directive（'shAddress predict'，函数（）{
    返回{
        要求：'ngModel'，
        链接：功能（范围，元素，ATTRS，位置）{
          VAR的选择= {
              类型：['地址']，
          };
          scope.gPlace =新google.maps.places.Autocomplete（元素[0]，期权）;
          google.maps.event.addListener（scope.gPlace，'place_changed'，函数（）{              VAR地方= scope.gPlace.getPlace（）;              scope.form.object.fullAddress = place.name;
              scope.form.object.placeId = place.place_id;
              scope.form.object.locality ='';
              scope.form.object.localityId ='';
              scope.form.object.sublocality_level_1 ='';
              scope.form.object.country ='';              VAR城市='';
              angular.forEach（place.address_components，功能（数据）{
                scope.form.object [data.types [0]] = data.long_name;
                如果（data.types [0] ==='地方'）城市+ = data.long_name +'，';
                如果（data.types [0] ==='administrative_area_level_1'）城市+ = data.short_name +'，';
                如果（data.types [0] ==='国家'）城市+ = data.long_name;
              }）;              //葛亭城市ID
              VAR的服务=新google.maps.places.AutocompleteService（）;
              service.getPlace predictions（{
                输入：城市，
                类型：'（市）]
              }，功能（数据）{
                scope.form.object.localityId =数据[0] .place_id;
              }）;
              。范围$适用（）;
          }）;
      }
  };
}）;
 

解决方案

由于，行 scope.form.object.localityId =数据[0] .place_id; 是即异步调用回调函数。意思是，你的范围。$适用（）的localityId上设置的范围之前被调用。因此，你需要设置localityId以及后触发摘要。

  service.getPlace predictions（{
    输入：城市，
    类型：'（市）]
}，功能（数据）{
    范围。$应用（函数（）{
        scope.form.object.localityId =数据[0] .place_id;
    }）;
}）;
 

I got directive for address autocomplete and get places info. Also I have added a code for getting city id and the code worked in one of my past project, but not working now ( The data[0].place_id in the code have a correct value but scope.form.object.localityId is empty outside the function.

PS scope.form.object... is declared in a parent controller of the directive and other variables are filling correct

.directive('shAddressPredict', function(){
    return {
        require: 'ngModel',
        link: function(scope, element, attrs, location) {
          var options = {
              types: ['address'],
          };
          scope.gPlace = new google.maps.places.Autocomplete(element[0], options);
          google.maps.event.addListener(scope.gPlace, 'place_changed', function() {

              var place = scope.gPlace.getPlace();

              scope.form.object.fullAddress = place.name;
              scope.form.object.placeId = place.place_id;
              scope.form.object.locality = '';
              scope.form.object.localityId = '';
              scope.form.object.sublocality_level_1 = '';
              scope.form.object.country = '';

              var city = '';
              angular.forEach(place.address_components, function(data) {
                scope.form.object[data.types[0]] = data.long_name;
                if(data.types[0] === 'locality') city += data.long_name + ', ';
                if(data.types[0] === 'administrative_area_level_1') city += data.short_name + ', ';
                if(data.types[0] === 'country') city += data.long_name;
              });

              // Geting city id
              var service = new google.maps.places.AutocompleteService();
              service.getPlacePredictions({
                input: city,
                types: ['(cities)']
              }, function(data){
                scope.form.object.localityId = data[0].place_id;
              });
              scope.$apply();
          });
      }
  };
});

解决方案

Because, the line scope.form.object.localityId = data[0].place_id; is a callback function that is called asynchronously. Meaning, your scope.$apply() is called before the localityId is set on the scope. So you need to trigger a digest after setting localityId as well.

service.getPlacePredictions({
    input: city,
    types: ['(cities)']
}, function(data){
    scope.$apply(function () {
        scope.form.object.localityId = data[0].place_id;
    });
});

这篇关于Scope变量没有设置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！