angle：$ scopeはHTMLから値を読み取っていません

Question

私はこのコードをView/HTMLから取得する予定ですが、変数$ scope.cityNameは未定義です。ここで

app.controller("citycontroller", function ($scope, cityfactory) { 
     $scope.searchByCid = function() { 
      console.log("Checking for city data"); 
      var promise = cityfactory.serverCall($scope.cityName); 
      promise.then(function (data) { 
       $scope.result = data.data; 
       console.log($scope.result); 
      }, function (error) { 
       $scope.error = error; 
      }); 
     }; 
     console.log($scope.cityName); 
    }); 

はHTML

<div> 
      <input type="text" ng-model="cityName" placeholder="Search places.." ng-init="cityName='Delhi'"> 
      <button ng-click="searchByCid()" id="checkcity">Check</button> 
     </div> 

Answer 1

console.log($scope.cityName);

であるこの文は消化サイクルが実行を引き起こすことを任意の変更イベントハンドラまたは機能の一部ではありません。

あなたcityNameあなたはJSでそれを確認したいchanging.Ifです：

$scope.callMe = function(){ 
    console.log($scope.cityName); 
} 

HTML：

使用ngChange

<input type="text" ng-model="cityName" placeholder="Search places.." ng-init="cityName='Delhi'" ng-change="callMe()"> 

または単にinterploation使用してHTMLにチェック：

を

<span>{{cityName}} </span> 

または

use $scope.$watch JSで。

$scope.$watch('cityName',function(oldVal,newVal){ 

    console.log(newVal); //it will print new updated cityname 
}) 

Answer 2

単一の変数$scope.cityNameではなく、コントローラにオブジェクトを作成します。 $scope.data.cityNameのようなものを使用して、ng-modelをdata.cityNameに変更してみてください。また、コントローラの初めに変数を初期化してみてください。

Answer 3

console.log($scope.cityName); 

この文は、$ scope.searchByCid関数の外にあります。コントローラは（HTMLのレンダリング中に）ロードされた最初の時間を取得すると、それはので、それは$ scope.cityNameのための未定義を示していることの

console.log($scope.cityName); 

を呼んでいます。

しかし、$ scope.searchByCidに$ scope.cityNameが表示されるのは、ng-init属性を使用して初期化されているためです。

あなたのメソッド内でconsole.logをシフトします。