gpt4 book ai didi

html - 如何在 html 文档中打印对象的值?

转载 作者:行者123 更新时间:2023-11-28 01:09:32 30 4
gpt4 key购买 nike

我有一个 angularJS 函数,它从复选框集中获取一个值 - 哪个复选框被选中(true 或 false)并将此信息存储在一个对象中。然后它创建一个变量,存储对象第一个元素的值。如何在 html 文档中打印此值?我试过这个:

// app.js

var formApp = angular.module('formApp', [])

.controller('formController', function($scope) {

// we will store our form data in this object
$scope.formData = {};

var answer = formData[Object.keys(formData)[0]];

});
<-- index.html -->
<!DOCTYPE html>
<html>
<head>

<!-- CSS -->
<!-- load up bootstrap and add some spacing -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<style>
body { padding-top:50px; }
form { margin-bottom:50px; }
</style>

<!-- JS -->
<!-- load up angular and our custom script -->
<script src="http://code.angularjs.org/1.2.13/angular.js"></script>
<script src="app.js"></script>
</head>

<!-- apply our angular app and controller -->
<body ng-app="formApp" ng-controller="formController">
<div class="col-xs-12 col-sm-10 col-sm-offset-1">

<h2>Angular Checkboxes </h2>


...

<!-- MULTIPLE CHECKBOXES -->
<label>Favorite Colors</label>
<div class="form-group">
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.red"> Red
</label><br>
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.blue"> Blue
</label> <br>
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.green"> Green
</label>
</div>

...

<!-- SHOW OFF OUR FORMDATA OBJECT -->
<h2>Sample Form Object</h2>
<pre>
[[answer]]
</pre>

</div>
</body>
</html>

最佳答案

您可以直接进行绑定(bind):

<pre>{{formData.favoriteColors.red}}</pre>

使用:Object.keys(formData) 不能保证您将获得第一个值。排序将基于散列键。

关于html - 如何在 html 文档中打印对象的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38303989/

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