ng-repeat 用于具有多种类型的输入模板答案

【问题标题】：ng-repeat for input template with multiple typesng-repeat 用于具有多种类型的输入模板
【发布时间】：2015-06-24 19:21:30
【问题描述】：

我正在制作一个用户界面来添加和编辑数据库。我正在使用微风来管理数据库、用于显示的角度网格和用于用户输入的 ui-bootstrap 模式对话框。当我在输入标签上设置 type="" 时，我无法完成输入所有信息。如果 type="text" 则为我的主键（一个数字）引发错误。如果 type="number" 则不接受我的大多数其他输入。我相信我可以输入文本、数字和日期时间。有没有一种好的、直接的方法可以在我的模板中实现多种类型？我即将放弃，只需输入密钥，然后让用户将其余部分添加到表格中。

<div class="modal-body">
    <div ng-repeat="(key, value) in newRow">
        <label>{{key | uppercase}}</label>
        <input placeholder="Enter &quot;{{key}}&quot; value"
            class="form-control"
            type="number"
            ng-model="newRow[key]" />
     </div>
 </div>

【问题讨论】：

标签： javascript html angularjs angular-ui-bootstrap

【解决方案1】：

您可以使用 ng-class 返回“文本”、“数字”等。

<div class="modal-body">
    <div ng-repeat="(key, value) in newRow" ng-class="{text:checkDataType(), number:checkDataType()}">
        <label>{{key | uppercase}}</label>
        <input placeholder="Enter &quot;{{key}}&quot; value"
            class="form-control"
            type="number"
            ng-model="newRow[key]" />
     </div>
 </div>

我不确定你是否有办法从你得到的数据中找出数据类型，所以我把 checkDataType() 作为填充符。如果您确实有办法找出数据类型，则可以相应地将其设置为字符串。如果没有，您将不得不创建 checkDataType() 函数并编写一些 js。如果您有任何疑问或需要示例，请告诉我。祝你好运！

【讨论】：