从控制器中的 ng-repeat 获取带有索引的 ng-model

Question

我找不到这个问题的答案 google 所以我 post 我的问题在这里 :

我需要根据我从 ng-model 指令获得的输入值向 php 文件发送一个 http.post 请求，在我看来它位于 [=12] =].我必须使用 $index，因为它的形式对我的 database.In 简单单词中的每一行重复，它用于更新我的数据库，但只是我感兴趣的行

但我不断收到以下错误

TypeError: Cannot read property '0' of undefined

因为我的ng-model好像有别的名字。你能解释一下如何用索引在控制器中命名一个 ng-model 值，以便它与视图中的一个匹配。提前致谢。

这是我的代码：

     <ul>
      <li class="err" ng-repeat="error in admin.errors"> {{error}} </li>
    </ul>
    <ul>
     <li class="info" ng-repeat="msg in admin.msgs"> {{msg}} </li>
    </ul>
    <form class="form-inline" ng-repeat="data in admin.datas track by $index"  novalidate ng-submit="admin.modify($index)">
    <div class="form-group">
        <div class="col-10">
            <input class="form-control" type="text" ng-value="data.id" ng-model="admin.id[$index]" id="id">
        </div>
    </div>
    <div class="form-group">
        <div class="col-10">
            <input class="form-control" type="text" ng-value="data.nom" ng-model="admin.nom[$index]" id="nom">
        </div>
    </div>
    <div class="form-group">
        <div class="col-10">
            <input class="form-control" type="text" ng-value="data.prenom" ng-model="admin.prenom[$index]" id="prenom">
        </div>
    </div>
    <div class="form-group">
        <select class="form-control" id="structure" ng-value="data.structure" ng-model="admin.structure[$index]">
            <option value="1">Structure 1</option>
            <option value="2">Structure 2</option>
            <option value="3">Structure 3</option>
            <option value="4">Structure 4</option>
            <option value="5">Structure 5</option>
        </select>
    </div>
    <div class="form-group">
        <div class="col-10">
            <input class="form-control" type="text" id="fonction" ng-value="data.fonction" ng-model="admin.fonction[$index]">
        </div>
    </div>
    <div class="form-group">
        <textarea class="form-control" id="message" rows="1" ng-value="data.message" ng-model="admin.message[$index]"></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Modifier</button>
 </form>

my controller : 

    (function() {
    'use strict';
    angular
    .module('AA')
    .controller('adminCtrl', adminCtrl);

    function adminCtrl($http){
        const admin = this;
        /* Parti recup*/
        admin.datas = [];

        admin.getMsg = function(){
            $http.get('/dylan/ActeurAvenir/libs/read.php').then(function(response) {
                admin.datas = response.data;

            })  
        }
        admin.getMsg();

        /* Parti post*/
        admin.msgs = [];
        admin.errors = [];
        admin.modify = function($index){

            $http.post('/dylan/ActeurAvenir/libs/modify.php', {
                'id'        : admin.id[$index],
                'nom'       : admin.nom[$index],
                'prenom'    : admin.prenom[$index],
                'structure' : admin.structure[$index],
                'fonction'  : admin.fonction[$index],
                'message'   : admin.message[$index]
            }
            ).then(function(result) {
                if (result.data.msg != '')
                {
                    admin.msgs.push(result.data.msg);
                }
                else
                {
                    admin.errors.push(result.data.error);
                }
            })  
        }
    };
    adminCtrl.$inject = ['$http'];
})();

Answer 1

这里

 $http.post('/dylan/ActeurAvenir/libs/modify.php', {
                'id'        : admin.id[$index],
                'nom'       : admin.nom[$index],
                'prenom'    : admin.prenom[$index],
                'structure' : admin.structure[$index],
                'fonction'  : admin.fonction[$index],
                'message'   : admin.message[$index]
            }

我认为您需要访问 admin.datas[$index].id、admin.datas[$index].nom 等等，因为 admin.datas 是数组

关于你的ng-model

你应该反对

ng-model="data.id" 来自您的 ng-repeat 而不是使用 admin.datas[$index].id

它的代码更少，更具声明性，如果您添加过滤器，您的代码将停止工作。

Answer 2

好的，感谢 Gonzalo 的回答和我自己的调查，我找到了答案，您在这里需要做的是更改 http.post() 值，使其类似于

'id' : admin.datas[$index].id, admin.datas[$index].nom 等等

并更改视图中的 ng-model，如下所示：

ng-model="admin.datas[$index].id"

希望这对以后的人有所帮助。

从控制器中的 ng-repeat 获取带有索引的 ng-model

Get ng-model with index from ng-repeat in controller

indexing

angularjs

angularjs-ng-repeat

angular-ngmodel