NG-選項不刷新有線標籤時下拉改變

Question

繼斯科特·艾倫的第一個代碼（簡單）sample，之後下拉條目改變有線NG-模型不刷新此

{{ engineer.currentActivity}}

瀏覽器：FF 50.1.0

角：1.5.9

的jQuery：1.7

HTML：

<div ng-controller="EngineeringController"> 
     {{engineer.name}} is currently : {{engineer.currentActivity}} 
     <div> 
      choose an activity: 
      <select id="agDDLClient" ng-model="EngineeringController.currentActivity" ng-options ="act for act in activities"> 
      </select> 
     </div> 
     <input type="button" ng-click="what()" value="check" /> 
    </div> 

JS：

var aIS = angular.module("app", []); 
aIS.controller("EngineeringController", function($scope, $http) 
{ 
    $scope.engineer = { 
    name: "Dani", 
    currentActivity: "Fixing bugs" 
}; 

$scope.activities = 
[ 
    "Writing code", 
    "Testing code", 
    "Fixing bugs", 
    "Dancing" 
]; 

$scope.what = function(){ alert($scope.engineer.currentActivity);} 
}); 

Answer 1

ng-model值應該是engineer.currentActivity而不是EngineeringController.currentActivity，因爲您試圖提醒$scope.engineer.currentActivity裏面的what()函數。

工作演示：

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('EngineeringController',function($scope) { 
 
    $scope.engineer = { 
 
     name: "Dani", 
 
     currentActivity: "Fixing bugs" 
 
    }; 
 

 
    $scope.activities = [ 
 
     "Writing code", 
 
     "Testing code", 
 
     "Fixing bugs", 
 
     "Dancing" 
 
    ]; 
 

 
    $scope.what = function() { 
 
     alert($scope.engineer.currentActivity); 
 
    }; 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="EngineeringController"> 
 
     {{engineer.name}} is currently : {{engineer.currentActivity}} 
 
     <div> 
 
      choose an activity: 
 
      <select id="agDDLClient" ng-model="engineer.currentActivity" ng-options ="act for act in activities"> 
 
      </select> 
 
     </div> 
 
     <input type="button" ng-click="what()" value="check" /> 
 
    </div>

Answer 2

更改爲ng-model="engineer.currentActivity"，而不是ng-model="EngineeringController.currentActivity"

，也是你的控制器代碼應遵循此

var aIS = angular.module("app", []); 
aIS.controller("EngineeringController", function($scope, $http) 
{ 
    $scope.engineer = { 
    name: "Dani", 
    currentActivity: "Fixing bugs" 


$scope.activities = 
[ 
    "Writing code", 
    "Testing code", 
    "Fixing bugs", 
    "Dancing" 
]; 

$scope.what = function(){ alert($scope.engineer.currentActivity);} 
});