我有一个与外部 API 通信的 Angular 应用程序。我能够从 Angular $resource 调用中生成初始视图。我的问题是我有一个在 ng-click 上运行函数的表单。然后该函数再次查询 API 并应该更新相同的范围变量,但我无法获得第二个 $resource 调用的结果以更新范围变量。
在我的控制器中,这是获取最初显示在视图中的数据的初始调用:
// Initial weather and geolocation data
var Weather = $resource('http://example.com/:method');
Weather.get({method: 'current'}).$promise.then(function(weather) {
// Success
$scope.weather = weather.weather;
$scope.geolocation = weather.location;
}, function(error) {
// Failure
$scope.weather = error;
});
到目前为止一切顺利,视图更新了,我可以显示 API 发回的 JSON{{ weather.currently.temp }}
以及 {{ geolocation }} 变量中的所有数据。
但是,我有一个表单(它已正确设置为与控制器对话),在提交时应该向同一个 API 发出另一个请求并返回新数据:
// Search functionality
$scope.weatherLookup = function(query) {
$http.get('http://example.com/location/' + query).then(function (value) {
$scope.weather = value;
});
};
此时,在视图中,{{ weather }} 变量不会在任何地方更新。完全没有。如果我在尝试获取的值时在函数中抛出一个console.log
函数,但是当我在同一语句中请求时,我确实得到了一个有效的 JSON 对象。weatherLookup
undefined
$scope.weather
value
console.log()
如何将该value
变量分配给$scope.weather
内部$scope.weatherLookup
,以便它可以更新该值并将其冒泡到视图中?