Question

情境： 我正在尝试访问ng-Model对象（myRide）的属性（代码）。

我尝试过这样做
```
<select ng-model = "myRide" 
  ng-change = "getCode(myRide.code)"> 
```
...和getCode，

alert(parameter) //which should be myRide.code.
我也试图通过
来做到这一点
```
<select ng-model = "myRide" 
  ng-change = getCode(myRide)
```
（注意：传递'myRide'，而不是'myRide.code'）...并且在getCode中，

alert(myRide.code).

myRide确实包含一个名为'code'的属性，该属性未定义。

问题：两次尝试都不会产生想要的结果。

如何让它显示属性（代码）？

这是JSFiddle：http://jsfiddle.net/a2J6z/1/

Answer 1

更好的方法是重构视图。不使用ng-repeat on选项内的选项，而是使用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/

Answer 2

我更新了小提琴：

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。

从HTML选择访问对象属性。

2 个答案: