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

时间:2017-03-14 16:28:35

标签: angularjs indexing angularjs-ng-repeat angular-ngmodel

我无法通过谷歌找到答案,所以我在这里发布我的问题:

我需要根据我在视图中从ng-model指令获得的输入值向php文件发送http.post请求,但它位于ng-repeat内。我必须使用$index,因为它来自一个重复数据库中每一行的表单。简单来说,它是用于更新我的数据库,但只是我感兴趣的行

但我一直收到以下错误

  

TypeError:无法读取未定义的属性“0”

因为我的ng模型似乎有另一个名字。你能解释一下如何在控制器中用索引命名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'];
})();

2 个答案:

答案 0 :(得分:1)

下面

$stmt = $dbCon->prepare("UPDATE rating SET votes = votes + 1, rating = rating + ? WHERE id = ?");
$stmt->bind_param('ii', $_POST['voteValue'], $_POST['id']);
$stmt->execute();

我认为您需要访问 $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

代码更少,声明性更强,如果添加过滤器,代码将停止工作。

答案 1 :(得分:0)

好的,所以我找到了答案,感谢Gonzalo的回答和我自己的调查,你需要做的是更改http.post()值,这样就像

'id' : admin.datas[$index].id, admin.datas[$index].nom依此类推

并在视图中更改ng-model,如下所示:

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

希望这将有助于将来。