所选选项更改时模型未更新

Model isn't updating when selected option changes

我的 Angular.js 项目有一个绑定到模型的 select 元素。在加载时,适当的选项是 selected 但是 selecting 另一个选项似乎不会更新模型,至少不会永久更新。如果我以编程方式更改模型,但结果如预期的那样。

控制器:

angular.module('myApp.controllers').controller('HomeCtrl',function($scope){
  $scope.month = "08"; // this default value is selected on-load as expected
  $scope.updateMonth = function() {
   console.log($scope.month); // this shows the original value not the newly selected value
   // a http request and other things happen here...
  };
  $scope.logMonth = function(month) {
   console.log(month); // this shows the newly selected value as expected
  }
 });

模板:

<select ng-model="month" ng-change="logMonth(month);">
 <option value="07">07</option>
 <option value="08">08</option>
 <option value="09">09</option>
</select>
<button ng-click="updateMonth();">Update Month</button>

听起来像是 angular 范围界定问题。范围继承适用于范围内的对象,但不适用于基元。尝试将 $scope.month = "08" 更改为 $scope.month = {selected: "08"}。然后在您的控制器中,将 html 更改为以下内容。

<select ng-model="month.selected" ng-change="logMonth(month.selected);">