請關注我的微信公眾號

程式碼

html

<div>
    <div class="modal-header">
        <h3 class="modal-title">用例集全域性引數配置</h3>
    </div>
    <div class="modal-body">
        <table class="table table-hover">
            <thead>
            <tr>
                <th
 
>引數</th>
                <th>引數值</th>
            </tr>
            </thead>
            <tbody ng-repeat="param in params">
            <tr>
                <td>{{param}}</td>
                <td><input name="test" class="form-control" type
 
="text" ng-trim="false" ng-model="$parent.conf[$index]"/></td>
            </tr>
            </tbody>
        </table>


    </div>

    <div class="modal-footer">
        <button class="btn btn-primary" ng-click="ok()">
            應用
        </button>
        <button
 
 class="btn btn-warning" ng-click="cancel()">取消</button>
    </div>

</div>

JS

var ModalInstanceCtrl = function ($scope, $modalInstance, params) {
            $scope.params = params;
            $scope.conf = [];
            $scope.ok = function () {
                console.log($scope.conf);
                $modalInstance.close($scope.conf);
            };
            $scope.cancel = function () {
                $modalInstance.dismiss('cancel');
            };
        };

問題描述

因為ng-model是ng-repeat動態生成的，ng-model=”變數”，什麼變數，是未知的，所以你無法在$scope."變數"取到值，就算取到值也是其中一個值，這個問題困擾了我一天，終於解決了。

解決方法

首先ng-model設定為$parent.conf[$index]:

• 用$parent的原因是ng-repeat產生的，他會為每一個input生成一個子scope物件，而$parent表示用父類的scope，這樣我們在JS檔案中才能取到該值。
• $index代表的意思是ng-repeat="param in params"遍歷時的下標
• conf是我們在js中的變數名

我們在controller中定義了一個$scope.conf = [];就是一個數組，剛好通過上面的程式碼，為該陣列添加了元素，然後我們通過scope.conf剛好把ng-model的所有元素自動儲存了。

實際效果