У меня есть простая страница, на которой есть список существующего элемента (они могут быть изменены) и возможность добавления новых элементов в существующий список.Модель не обновляется - AngularJS
Существует 2 секции, CodeLookup и Benchmark. Конструкция обоих секций одинакова (как описано выше).
Существует ссылка, которая вернет все изменения в исходное состояние страницы. В JS есть массивы, один для хранения отображаемого списка и резервный массив, в котором хранится начальное состояние списка. Существует функция добавления, которая добавляет новые данные в список. Наконец, существует метод отмены (связанный с отменой ссылки), который восстановит список до его начального состояния. Этот метод отмены просто помещает исходный список в список, используемый для отображения данных.
Теперь значение codelookup восстанавливается при ударе отменить в первый раз. Но если вы измените еще раз в списке и отмените отмену, восстановление не произойдет. Кроме того, бенчмарк не сохраняется. Я установил точку останова в инструменте Chrome dev и обнаружил, что список содержит значения из исходного списка, но не отражает его в пользовательском интерфейсе.
Любая помощь в фиксации оценивается.
Ниже приведен код:
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<SCRIPT type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.7/angular.min.js"></SCRIPT>
<script type="text/javascript">
var referenceDataMaintainenceApp = angular.module('referenceDataMaintainenceApp',[]);
referenceDataMaintainenceApp.controller('referenceDataMaintainenceCtrl', function ($scope) {
$scope.orig_lookup_codes_details;
$scope.orig_calendar_details;
$scope.orig_pams_fields;
$scope.orig_brokers_details;
$scope.lookup_codes_details = [{'lookupName':'ac_asset','codeName':'ABCD','codeDetail':'sdfsdfsdf','ruleDetail':'sdsdsdsdsd','active':false}];
$scope.benchmarks_details = [{'benchmarkName':'Bench1','benchmarkDesc':'First Entry','active':false}];
$scope.orig_lookup_codes_details = angular.copy($scope.lookup_codes_details);
$scope.orig_brokers_details = angular.copy($scope.benchmarks_details);
$scope.addLookupCode = function() {
$scope.lookup_codes_details.push($scope.new_lookup_code);
$scope.new_lookup_code = getLookupCodeObject();
};
$scope.addBenchMark = function() {
$scope.benchmarks_details.push($scope.new_benchmark);
$scope.new_benchmark = getBenchMarkObject();
};
$scope.cancelData = function() {
$scope.brokers_details = $scope.orig_brokers_details;
$scope.lookup_codes_details = $scope.orig_lookup_codes_details;
console.log("sdsd");
//$http.post('/data/save', $scope.benchmarks_details);
};
});
function getLookupCodeObject() {
lookup_code = {
lookupName : '',
codeName : '',
codeDetail : '',
ruleDetail : '',
active : false
};
return lookup_code;
}
function getBenchMarkObject() {
benchmark = {
benchmarkName : '',
benchmarkDesc : '',
benchmarkId : '',
benchmarkType : ''
};
return benchmark;
}
</script>
</head>
<body ng-app="referenceDataMaintainenceApp" ng-controller="referenceDataMaintainenceCtrl" >
<div><A class="operationalnav" ng-click="cancelData()"
href="javascript:;">Cancel</A> </div>
<br />
<br />
<TABLE id="tblGridLookupCodes" class="tableData" border="0"
width="100%">
<THEAD>
<TR bgColor="#eaeaea">
<TD class="tableTitle" noWrap>Code Name</TD>
<TD class="tableTitle" noWrap>Description</TD>
<TD class="tableTitle" noWrap align="center">Active</TD>
</TR>
</THEAD>
<TBODY>
<TR ng-repeat="lookup_code_detail in lookup_codes_details">
<td nowrap="nowrap">{{lookup_code_detail.codeName}}</td>
<td nowrap="nowrap">
<input type="text" name="codeLookupBean[0].codeDescription"
maxlength="100" size="80" ng-model="lookup_code_detail.codeDetail" />
</td>
<td nowrap="nowrap" align="center">
<input type="checkbox" name="codeLookupBean[0].active"
ng-model="lookup_code_detail.active" />
</td>
</TR>
</TBODY>
</TABLE>
<HR width="100%">
<table>
<tr>
<td>
<INPUT id="codeNameInput" name="codeNameInput"
maxLength="32" ng-model="new_lookup_code.codeName" />
</td>
<td>
<INPUT id="descInput" name="descInput" maxLength="100"
size="80" ng-model="new_lookup_code.codeDetail">
</td>
<td>
<INPUT id="activeInput" name="activeInput" CHECKED type="checkbox"
ng-model="new_lookup_code.active" />
</td>
<td>
<INPUT id="btnAddRow" class="btnz" title="Add Row"
ng-click="addLookupCode($event)" name="btnAddRow" value=" Add "
type="button" />
</td>
</tr>
</table>
<br /><br /><br />
<TABLE id="tblGridBenchmarks" class="tableData" border="0" width="100%">
<THEAD>
<TR bgColor="#eaeaea">
<TD class="tableTitle" noWrap>Benchmark Name</TD>
<TD class="tableTitle" noWrap>Description</TD>
</TR>
</THEAD>
<TBODY>
<TR ng-repeat="benchmark_detail in benchmarks_details">
<TD>{{benchmark_detail.benchmarkName}}</TD>
<TD><INPUT name="benchmarkBean[0].benchmarkDesc"
maxLength="255" size="120" ng-model="benchmark_detail.benchmarkDesc"></TD>
</TR>
</TBODY>
</TABLE>
<HR width="100%">
<table>
<tr>
<td>Enter Benchmark Name:<BR> <INPUT
id="benchmarkNameInput" name="benchmarkNameInput"
ng-model="new_benchmark.benchmarkName" maxLength="100" size="30">
</td>
<td>Description:<BR> <INPUT name="benchmarkDescInput"
ng-model="new_benchmark.benchmarkDesc" maxLength="255" size="80">
</td>
<td><INPUT id="btnAddRowComment" class="btnz" title="Add Row"
ng-click="addBenchMark($event)" name="btnAddRowComment"
value=" Add " type="button"></td>
</tr>
</table>
мы можем увидеть некоторый код? –
Очень сложно помочь вам на основе этой истории. Мы могли бы действительно использовать ваш код, чтобы его улучшить. –
Кори Сильва, Оскар Бут: Мне очень жаль. Я сделал миниатюрный вариант экрана, в котором есть эта проблема. Из-за некоторого отвлечения я забыл прикрепить код. Я добавил его сейчас. – user3359005