【问题标题】:Angular $resource data is available to view but not in the codeAngular $resource 数据可以查看,但不能在代码中查看
【发布时间】:2015-05-04 16:24:27
【问题描述】:

我是一个有角度的菜鸟,对某个特定问题感到非常沮丧。

我有一个 $resource 从服务器返回数据,其中包含键/值对,即 detail.name、detail.email 等。

我可以使用{{detail.name}} 表示法访问视图上的这些信息,但我无法在代码中访问它,这让我抓狂,因为我需要这些数据来处理事情。

如何在后端访问它?

这是生成数据的代码:

mydata = Appointment.get({id: $stateParams.id}, function(data){
    geocoder.geocode(data);
    $scope.detail = data;
});

我有以下观点:

<address class="text-left"> 
                {{detail.address_1}}</br>
                {{detail.city}}</br>
                {{detail.postcode}}</br>
                </address>
        </hr>       
        <p> {{detail.lat}}</p>
        <p> {{detail.lng}}</p>
        <p> {{center}}</p>

这一切都好。

但是,如果我在 $resource 回调中添加console.log($scope.detail.lat),我会得到未定义。

这里是资源定义:

angular.module('MyApp')
.factory('Appointment', function($resource){
    return $resource('/api/admin/:id', { id: "@_id" }, {
         query: {method:'GET', isArray:true}, 
         update: { method:'PUT' }
    });
})

如果有人感兴趣,还有地理编码器工厂:

angular.module('MyApp')
.factory('geocoder', ['$http','$state', function($http, $state){

var geocoder ={};

geocoder.geocode = function (formData){
    var myformData = {};
    var address = formData.address_1+', '+formData.city+', '+formData.postcode;

                var key = 'AIzaSyACVwB4i_6ujTrdjTMI-_tnsDrf6yOfssw';

                $http.get('https://maps.googleapis.com/maps/api/geocode/json?address='+address+'&key='+key).
                  success(function(results, status, headers, config) {
                    var results = results.results[0];
                    formData.lat = results.geometry.location.lat;
                    formData.lng = results.geometry.location.lng;
                        myformData = formData;
                    return myformData;          

                     // this callback will be called asynchronously
                    // when the response is available
                  }).
                  error(function(results, status, headers, config) {
                    // called asynchronously if an error occurs
                    // or server returns response with an error status.
                  });   
}


return geocoder;

}])

谁能帮忙?

【问题讨论】:

  • 地理编码器工厂设置错误....应该返回$http 承诺并使用承诺解析then() 来设置数据。确实需要了解asynchronous 的含义并深入研究我在您上一个问题中提供的链接

标签: javascript php html angularjs google-maps


【解决方案1】:

您可以利用 $resource 对象的承诺返回,然后在控制器中使用该承诺。

工厂

angular.module('MyApp')
.factory('Appointment', function($resource){
    return $resource('/api/admin/:id', { id: "@_id" }, {
         query: {method:'GET', isArray:true}, 
         update: { method:'PUT' }
    });
})

控制器

mydata = Appointment.get({id: $stateParams.id}).$promise;
mydata.then(function(data){
    geocoder.geocode(data);
    $scope.detail = data;
});

【讨论】:

  • @Mobaz 对你有帮助吗?
猜你喜欢
  • 2023-03-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-09-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多