我无法访问对象的属性，即使我可以看到它的内容

Question

当我使用 bootstrap 的下拉菜单方式时，这段代码工作得很好.. 现在我切换到传统方式，我不知道为什么会遇到这个问题。为什么我不能访问属性？？快把我逼疯了

HTML

    <select class="form-control" ng-model="client" ng-change="clientSelect(client)">
        <option value="">--- Please Select ---</option>
        <option ng-repeat="client in clientList" value="{{client}}">{{client.clientName}}</option>
    </select>

Angular/Javascript

$scope.clientSelect = function (client) {
  console.log(client);
  console.log(client.clientName);  //is undefined
  console.log(client.clientId);  //is undefined
}

输出：

{"clientId":102,"clientName":"Testing"}  //i clearly see the properties here...
UsersController.js:130 undefined
UsersController.js:131 undefined

编辑：当我 console.log($scope.clientList) 没问题..数组中第一项的对象如下所示：

0：对象 $$哈希键："object:254" 客户编号：102 客户姓名："Testing" _proto: 对象

Answer 1

您无法访问属性，因为您从 ng-repeat 获得的 client 是 string。

检查我用您的代码创建的 Plunker 的控制台日志。您会看到第一个 consol.log(client) 实际上是注销此字符串：{"clientId":102,"clientName":"Testing 1"}。因此，它没有任何属性。

来自select docs：

Note that the value of a select directive used without ngOptions is always a string. When the model needs to be bound to a non-string value, you must either explictly convert it using a directive (see example below) or use ngOptions to specify the set of options. This is because an option element can only be bound to string values at present.

考虑在 ng-repeat 中使用 ngOptions 指令而不是 <select>。

我无法访问对象的属性，即使我可以看到它的内容

I can't access the properties of an object even though I can see it's contents

javascript

twitter-bootstrap

angularjs

angularjs-scope

angular-ui-bootstrap