使用 ng-model 传递给函数的变量未定义答案

【问题标题】：Variable passed to function using ng-model stays undefined使用 ng-model 传递给函数的变量未定义
【发布时间】：2015-02-13 20:12:43
【问题描述】：

创建表后，我想将其中一个<td>s 中的值发送到使用 ng-model 的函数，但无论我尝试什么，该变量都保持未定义。
该变量应包含名为 saveCron() 的单元格内的值。当我试图破坏 cron_format 单元格内的值时，问题就开始了。我用letters() 函数拆分值：

$scope.letters = function(rawname) {
    var lettersarray = rawname.split(" ");
    return lettersarray;
};

现在每个字符都有自己的输入字段，而不是一个输入字段中的所有 cron_format 值。

表格如下所示：

<table  ng-controller="tableCtrl">
    <thead>
    <th>user name</th>
    <th>script name</th>
    <th>cron format</th>
    </thead>
    <tbody ng-repeat="(user_id,row) in data">
    <tr ng-repeat="(script_id, cron_format) in row">
        <td>{{user(user_id)}}</td>
        <td>{{script(script_id)}}</td>
        <td ng-model="vm.l">
            <input type="text" ng-repeat="letter in letters(cron_format) track by $index"  value="{{letter}}"/>
            <button ng-click="saveCron(user_id,script_id,cron_format)">save</button>
        </td>
    </tr>
    </tbody>
</table>

和saveCron() 这样：

$scope.saveCron = function(userId,scriptId,cronFormat){
    console.log($scope.vm.l);
}

*在实践中，我还有更多:) 函数内部的复杂逻辑，但为了简单起见，我将保留这样的函数。

底线：如何将创建调用的<td> 中的整个值传递给 saveCron()？

示例：如果<td> 代码如下所示：

<td ng-model="vm.l">
<input value="1"><input value="2"><input value="3">
</td>

该函数将获得（记录）“123”，如果用户编辑了一些输入字段，让我们说：

<td ng-model="vm.l">
<input value="4"><input value="2"><input value="4">
</td>

然后点击保存，函数会得到 424... 有什么帮助吗？

【问题讨论】：

将 td 更改为 <td ng-model="vm.l"> <input type="text" ng-repeat="letter in letters(cron_format) track by $index" value="{{letter}}" ng-model="letter"/> <button ng-click="saveCron(user_id,script_id,cron_format)">save</button> </td> 现在这将进行双向绑定
不幸的是。控制台中仍然出现此错误：Cannot read property 'l' of undefined
ng- model="vm.l" 你不能在你的范围内得到这个
对不起，我对 Angular 有点陌生...你能解释一下你的意思吗？
你这里有很多问题，我试着在答案中解释。

标签： html angularjs angular-ngmodel

【解决方案1】：

好的，这里有一些问题。我会尽力把他们都打清楚。

所以基本上你最好重写这个。

首先，您正在尝试访问“vm.1”，通常 Angular 会为您创建一个变量，而无需定义它。但是由于您使用的是对象，因此需要将其定义为这样。所以在你的控制器中做。

$scope.vm = {};

会解决这个问题。

其次，您应该将您的 ng-model 放在输入本身上，而不是包装器上，它不像您现在设置的那样工作。 ng-model 不绑定任何东西，永远不会更新。

现在有几种不同的方法来处理如何获取这些值。我会假设您正在尝试做的是让人们能够更改这些值，然后从中运行一些功能。对吗？

这就是我的做法......

<td>
  <input ng-repeat='letter in whatever' ng-model='vm[user_id][$index]' value='{{letter}}'/>
  <button ng-click='saveCron(user_id,script_id,cron_format,vm[user_id])>Save</button>
</td>

所以这会将每组输入的数据直接发送到函数中。所以你的功能将是......

$scope.saveCron = function(userId,scriptId,cronFormat,data){
    console.log(data);
}

这些方面的东西对你有用。你的 ng-repeats 也很乱，所以我也会考虑重做。

编辑忘了提到这样做，您的数据将作为带有 key : value 的对象传入

【讨论】：