gpt4 book ai didi

javascript - 将 JSON 对象绑定(bind)为 AngularJS HTML 中的值选择 - 下拉列表

转载 作者:行者123 更新时间:2023-11-30 00:06:47 26 4
gpt4 key购买 nike

我有一个 JSON 集合

$scope.person = [
{
"Id": 1
"Name": "John"
},
{
"Id": 2
"Name": "Jack"
},
{
"Id": 3
"Name": "Watson"
},
];

在 HTML 中,我将上述集合绑定(bind)到 AngularJS HTML Select 中。完整的 HTML 源代码是

<!DOCTYPE html>
<html>
<head>
<title>HTML Select using AngularJS</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

<div class="md-block">
<label>Person</label>
<select ng-model="selected.person">
<option ng-repeat="key in person | orderBy:Id" value="{{key}}">({{key.Name}})</option>
</select>
</div>

</div>

<script>
var app = angular.module('myApp', []);

app.controller('myCtrl', function ($scope) {

$scope.person = [
{
"Id": 1,
"Name": "John"
},
{
"Id": 2,
"Name": "Jack"
},
{
"Id": 3,
"Name": "Watson"
}
];

$scope.selected = {
person: null
};

$scope.$watchCollection('selected.person', function (newData, oldDaata) {
var obj = JSON.parse(newData);
if ((obj != undefined) && (obj != null) && (obj.Id != undefined) && (obj.Id != null) && (obj.Id != "0")) {
var name = obj.Name;
alert(name);
}
});

});
</script>
</body>
</html>

我在下拉列表中选择了 Jack,我期望的选择值为

{
"Id": 2
"Name": "Jack"
}

但我得到的值是字符串形式 "{"Id":2,"Name":"Jack"}"

enter image description here

请帮助我,如何将值作为 JSON 对象...

最佳答案

您只需执行以下操作即可获取 JSON 对象:

JSON.parse(yourJsonString); 

所以你的代码应该是这样的:

 var newDataJSON = JSON.parse(newData)
var name = newDataJSON.Name

关于javascript - 将 JSON 对象绑定(bind)为 AngularJS HTML 中的值选择 - 下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38208965/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com