打破ng中的字符数组，重复并设置每个字符自己的输入标记

breaking array of chars inside ng-repeat and set each char its own input tag

本文关键字：字符 设置 自己的 输入 ng 数组 打破      更新时间：2023-10-15

我是angular的新手，正在寻找一种方法来获取表中的每个名称，并以每个字母都出现在其自己的<input>标记中的方式打断名称。因此，如果表单元格包含名称"Dave"，并且用户单击"D"，则只包含此字母的输入标记将被"选中"。这是行和表单元格：

<tr ng-repeat="name in data">
    <td class="name"><input type="text" ng-model="user_name"></td>
</tr>

有什么帮助或指导吗？

更新

我实际拥有的是我用来创建一个表的两个ng重复。该表有3列：username、scriptname和cron_format。我希望最终用户能够更改的唯一部分是cron格式，但我希望打破cron_format的方式是，如果用户单击"minute"值，则该值将是唯一标记的值，而不是所有的cron-format。。。这是表格：

<tbody ng-repeat="(user_id,row) in data">
<tr ng-repeat="(script_id, cron_format) in row" ng-init="oldCron = cron_format">
    <td class="userName">{{user(user_id)}}</td>
    <td class="scriptName">{{script(script_id)}}</td>
    <td class="cronFormat">
        <input type="text"  ng-model="cron_format" ng-blur="saveCron(user_id,script_id,cron_format,oldCron)"/></td>
    </td>
</tr>
</tbody>

这里有一个更完整的实现。您的数据通过作用域对象$scope.data。此对象包含一组对象，这些对象表示"people"，其"name"对应键。此实现包括一个作用域函数$scope.letters，该函数将名称字符串分解为其各自的单独字符。

JSFIDDLE演示

HTML:

<div ng-app="myApp">
    <div ng-controller="MyCtrl">
        <table>
            <tr ng-repeat="person in data">
                <td class="name">
                    <input type="text" ng-repeat="letter in letters(person.name) track by $index" value="{{letter}}">
                </td>
            </tr>
        </table>
    </div>   
</div>

JavaScript:

var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', ['$scope', function ($scope) {
    $scope.data = [
        {name:'Jim'},
        {name:'Dave'},
        {name:'Chelsea'}
    ];
    $scope.letters = function(rawname) {
        var lettersarray = rawname.split('');
        return lettersarray;
    };
}]);

*注意，track by $index对于任何包含重复字符（例如"Bill"）的名称都是必需的

相关文章：