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

Posted 2021-04-14

当我使用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>

角/ 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 $$ hashKey：“object：254”clientId：102 clientName：“Testing”_proto：Object

答案

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

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

来自select docs：

请注意，在没有ngOptions的情况下使用的select指令的值始终是一个字符串。当模型需要绑定到非字符串值时，您必须使用指令明确地转换它（请参阅下面的示例）或使用ngOptions指定选项集。这是因为选项元素目前只能绑定到字符串值。

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