时间戳

首页 > 解决方案 > ng-click 没有从表中返回修改过的数据

angularjs - ng-click 没有从表中返回修改过的数据

问题描述

我的表如下：

<div class="modal-body">
    <table class="table table-sm table-inverse table-responsive table-striped">
        <thead>
        <tr>
            <th>SL No.</th>
            <th>RuleName</th>
            <th>Message</th>
            <th>Priority</th>
            <th>Active</th>
        </tr>
        </thead>
        <tr ng-repeat="eachData in ruleEngineData">

            <td>{{$index + 1}}</td>
            <td>{{eachData.ruleType.ref}}</td>
            <td>{{eachData.ruleType.message}}</td>
            <td>
                <input id="number" type="number" value={{eachData.ruleType.priority}} min="1" max="3">
            </td>
            <td>
                <label class="switch">
                    <input ng-if="eachData.active == true" type="checkbox" checked>
                    <input ng-if="eachData.active == false" type="checkbox">
                    <span class="slider round"></span>
                </label>
            </td>

        </tr>
    </table>
    <footer>
        <button type="button" class="close" data-dismiss="modal">Cancel</button>
        <button class="submit" ng-click="modifyRuleEngine(ruleEngineData)">Save</button>
    </footer>
</div>

数据显示正确：

$scope.getRuleEngine = function() {
    var data = {
        orgId: localStorage.getItem('organization_id')
    };
    var config = {
        params: data
    };
    $http.get("/getRuleEngine", config).then(getRuleEngineCallBack, getRuleEngineErrorCallback);
}

但是当我在更改“优先级”和“活动”数据后单击保存时，修改后的值不会发回：

$scope.modifyRuleEngine = function(ruleEngineData) {
    var dataModified = {
        orgId: localStorage.getItem('organization_id')
    };
    var configModified = {
        params: data
    };
    $http.get("/modifyRuleEngine", configModified).then(modifyRuleEngineCallBack, modifyRuleEngineErrorCallback);
}

其中ruleEngineData有较早的数据，而不是修改过的数据。

标签： angularjs

解决方案

添加了这个指令：

app.directive('stringToNumber', function() {
    return {
        require: 'ngModel',
        link: function(scope, element, attrs, ngModel) {
            ngModel.$parsers.push(function(value) {
                return '' + value;
            });
            ngModel.$formatters.push(function(value) {
                return parseFloat(value);
            });
        }
    };
});

和 html 到：

 <td>
     <input id="number" type="number" string-to-number
            ng-model = "eachData.ruleType.priority"
            value={{eachData.ruleType.priority}} min="1" max="3">
 </td>

 <td>
     <label class="switch">
         <input ng-if="eachData.active == true" type="checkbox" checked
                ng-model = "eachData.active">
         <input ng-if="eachData.active == false" type="checkbox"
                ng-model = "eachData.active">
         <span class="slider round"></span>
     </label>
 </td>

推荐阅读