從HTML選擇訪問對象屬性。

場景： 我想要訪問ng-Model對象（myRide）的屬性（代碼）。從HTML選擇訪問對象屬性。

我試着通過
```
<select ng-model = "myRide" 
    ng-change = "getCode(myRide.code)"> 
```
...在引用代碼這樣做，

alert(parameter) //which should be myRide.code.
我也試圖通過
做到這一點
```
<select ng-model = "myRide" 
    ng-change = getCode(myRide) 
```
（注： 'myRide' 被傳遞，而不是 'myRide.code'）......，在引用代碼，

alert(myRide.code).

myRide確實含有一種被稱爲 '代碼' 屬性，這是不未定義。

問題：兩次嘗試都不會產生想要的結果。

如何讓它顯示屬性（代碼）？

這裏是的jsfiddle：http://jsfiddle.net/a2J6z/1/

來源

2013-06-28 daCoda

我更新了小提琴：

http://jsfiddle.net/a2J6z/3/

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

function aControlla($scope){ 

    $scope.myRide = "bus"; 

    $scope.getCode = function(car){ 
     alert(JSON.parse(car).code); 
    } 

    $scope.myGarage = [ 
     {Name: "Toyota 86", code:"1"}, 
     {Name: "Hyundai Genesis Coupe", code:"2"}, 
     {Name: "Nissan GTR", code:"3"}, 
     {Name: "Veyron", code:"4"} 
    ]; 
};

而且

<div ng-app="ngAppl"> 
    <div ng-controller="aControlla"> 

     <select ng-model="myRide" ng-change="getCode(myRide)"> 

      <option ng-repeat="car in myGarage">{{car}}</option> 
      <!--Note: value of myRide MUST be simply 'car' (not say, 'car.Code')--> 

     </select> 

     <br/> This shows that 'myRide' contains the property called 'Name', and importantly, 'code':<br/> {{myRide}} 




    </div> 
</div>

基本上我不得不爲它警告什麼車myRide作爲參數呃，它顯示了JSON字符串，所以我添加了解析讓它給我的代碼。可以說我是AngularJS noob的更好的方式。

來源

2013-06-28 02:16:11 shaunhusain

乾杯，你的方法效果很好。（最終版本：http://jsfiddle.net/a2J6z/6/） – daCoda

更好的方法是重構視圖。而不是在select中的選項中使用ng-repeat，請使用ng-options指令。然後，你可以將實際的對象綁定到模型上，而不僅僅是一個JSON字符串，這是你當前的小提琴正在做的事情。

您的新選擇的模樣

<select ng-options="car.Name for car in myGarage" ng-model="myRide" ng-change="getCode(myRide)"> 

</select>

然後在你的控制器

$scope.getCode = function(car){ 
    alert(car.code); 
}

更新的小提琴：

http://jsfiddle.net/a2J6z/5/

來源

2013-06-28 02:18:48 wrshawn

ng-options確實比ng-repeat更方便。不過，我需要使用ng-repeat作爲這個實例，我需要添加比myGarage更多的選項。 – daCoda

從HTML選擇訪問對象屬性。

回答

相關問題