Javascript 控制器中的分配未传递到服务

Javascript 控制器中的分配未传递到服务,javascript,angularjs,Javascript,Angularjs,控制器中的我的分配$scope.getForecastByLocation未传递给控制器。目前,city被指定为随机城市,如“Berkeley”,该城市被传递到工厂数据。但其思想是,当用户在输入中键入一个新城市时,它接受输入并向数据工厂发送一个新的城市参数 我一直在做console.logs,我可以看到按钮正在工作,但是调用了Data.getApps($scope.inputcity)不起作用,因此城市总是在“伯克利” 有人知道为什么我不能把一个新城市送到数据工厂吗?谢谢大家! index.ht

控制器中的我的分配
$scope.getForecastByLocation
未传递给控制器。目前,
city
被指定为随机城市,如“Berkeley”,该城市被传递到工厂数据。但其思想是,当用户在输入中键入一个新城市时,它接受输入并向数据工厂发送一个新的城市参数

我一直在做console.logs,我可以看到按钮正在工作,但是调用了
Data.getApps($scope.inputcity)不起作用,因此城市总是在“伯克利”

有人知道为什么我不能把一个新城市送到数据工厂吗?谢谢大家!

index.html

 <input ng-model="city">
  </md-input-container>
  <md-button class="md-raised" ng-click="getForecastByLocation(city)">SUBMIT</md-button>
service.js

app.factory('Data', function($http, $q) {

    var data = [],
       lastRequestFailed = true,
       promise;
   return {
      getApps: function(city) {
         if(!promise || lastRequestFailed) {
            // $http returns a promise, so we don't need to create one with $q

            promise = $http.get('http://api.openweathermap.org/data/2.5/weather?',{
              params: {
                q: city,
              }
            })
            .then(function(res) {
                lastRequestFailed = false;
                data = res.data;
                return data;
            }, function(res) {
                return $q.reject(res);
            });
         }
         return promise;
      }
   }
});
编辑:

我根据别人的建议修改了控制器代码,现在看起来是这样的。工厂是相同的,我已经删除了HTML中的参数

app.controller('weatherCtrl', ['$scope','Data',

    function($scope, Data) {
$scope.city = 'Berkeley';

$scope.getForecastByLocation = function() {
                console.log($scope.city); //making sure I can read the input
                console.log('this is your input ' + $scope.city);
                Data.getApps($scope.city).then(function(data){
                console.log('this is your output ' + $scope.city); //should say "This is your output "tracy", but it still reads at "Berkeley"

                    $scope.data = data;
                    $scope.name = data.name;
                    console.log($scope.data); //object shows "Berkeley"
                    console.log($scope.name);
                 });//initiate Data.getApps by passing in a new city
         }

var-app=angular.module('weatherApp.controllers',[])
var city=‘伯克利’;
app.controller('weatherCtrl'、['$scope'、'Data',
功能($范围、数据){
$scope.getForecastByLocation=函数(){
$scope.inputcity=$scope.city;
console.log($scope.inputcity);
Data.getApps($scope.inputcity).then(函数(数据){
$scope.data=数据;
$scope.name=data.name;
console.log($scope.data);//对象显示“Berkeley”
log($scope.name);
});//通过进入新城市启动Data.getApps
}
Data.getApps(城市)。然后(函数(数据){
$scope.data=数据;
var vm=$scope;
vm.description=data.weather[0]。description;
vm.speed=(2.237*数据风速).toFixed(1)+“mph”;
vm.name=data.name;
vm.湿度=data.main.湿度+“%”;
vm.temp=data.main.temp;
vm.fTemp=(vm.temp*(9/5)-459.67).toFixed(1)+“华氏度”;
},功能(res){
如果(资源状态===500){
//服务器错误,以某种方式提醒用户
}否则{
//可能会以不同的方式处理这些错误
}
}
);//函数结束
}]);
app.factory('Data',函数($http,$q){
var数据=[],
lastRequestFailed=true,
承诺;
返回{
getApps:功能(城市){
如果(!promise | | lastRequestFailed){
//$http返回一个承诺,因此我们不需要使用$q创建一个承诺
promise=$http.get('http://api.openweathermap.org/data/2.5/weather?',{
参数:{
问:城市,
}
})
.然后(功能(res){
lastRequestFailed=false;
数据=分辨率数据;
promise=false;//重置promise值。
返回数据;
},功能(res){
返回$q.reject(res);
});
}
回报承诺;
}
}
});

提交

我相信您的控制器正在尝试将
$scope.inputcity
赋值给
var city='Berkeley
的值,而不是赋值给函数参数
city
的值。最佳做法是避免对可从函数范围和函数参数访问的变量使用相同的名称

与其将
city
作为
ng click=“getForecastByLocation(city)”
的参数传递,为什么不直接在控制器中访问
$scope.city

您的函数可以如下所示:

$scope.getForecastByLocation = function() {
            console.log($scope.city);
            Data.getApps($scope.city).then(function(data){
                $scope.data = data;
                $scope.name = data.name;
                console.log($scope.data); //object shows "Berkeley"
                console.log($scope.name);
             });
     }

ngclick=>ngclick?哦,这是一个复制粘贴错误。在我的实际代码中,它实际上是ng-click。通过
$scope.city
获取城市值,而不是传递城市参数。您是在html中谈论的吗?那么数据工厂参数是否也应该更改?您也在谈论
$scope.inputcity
?我没有看到具体的
$scope.city
使用
ng model=“city”
将创建与
$scope.city
的双向绑定。如果这是一个如此基本的问题,我很抱歉,但我只想真正澄清我对angularjs的理解。如果是这样的话,那么在HTML中没有参数,它只是
ng click=getForecastByLocation()
对吗?那么在工厂中,它的参数是否也为
$scope.city
?正确,您不需要在html中为
getForecastByLocation()
设置参数。我建议设置一个默认值,如
$scope.city='Berkeley',这样您就不再有
city
变量导致与函数参数名称混淆。我认为您不需要对工厂进行更改,尤其是因为它没有访问
$scope
。不幸的是,我尝试了您的方法,尽管我正在尝试更改城市,但仍然得到了“Berkeley”的输出。如果您查看我上面的编辑,您可以看到我输入了“Tokyo”,它的内容是Tokyo作为
$scope.city
,但由于某种原因,它在工厂中没有作为参数传递。你知道为什么吗?是的,你的工厂没有改变
$scope.city
的值。我可能需要仔细查看您的工厂正在做什么,但一眼就可以看出,您需要将
$scope.city
分配给从
data.getApps()
传回的
数据,以更改其值。对不起,我很难理解
$scope.inputcity=$scope.city。如果我理解正确,输入现在将存储为
$scope.inputcity
,这是我们传递给数据工厂的参数。将其设置为$scope.city有什么意义?另外,我也尝试过你的方法,但是这个对象仍然是Berkeley:(API对我不起作用。
$scope.getForecastByLocation = function() {
            console.log($scope.city);
            Data.getApps($scope.city).then(function(data){
                $scope.data = data;
                $scope.name = data.name;
                console.log($scope.data); //object shows "Berkeley"
                console.log($scope.name);
             });
     }