我正在重复ng-repeat下拉列表选择的项目时间。当我要访问ng-model时,ng-repeat内部的按钮点击功能在ng-repeat之外我没有得到价值ng-model .it显示未定义。
<div data-ng-repeat="R in RespPerson">
<table cellpadding="0" cellspacing="0" class="_tblrating" style="margin: 0px; padding: 0px">
<tr class="_labeltr">
<td>
<span>Productivitiy </span>
</td>
<td>
<span>Quality </span>
</td>
<td>
<span>Cost </span>
</td>
<td>
<span>Delivery </span>
</td>
<td>
<span>Safety </span>
</td>
<td>
<span>Environment </span>
</td>
<td>
<span>Technology </span>
</td>
<td>
<span>Aesthetics </span>
</td>
<td>
<span>RPN NO </span>
</td>
<td>
<span>Categorisation of Problem </span>
</td>
</tr>
<tr>
<td>
<input id="txtProductivitiy" type="text" ng-bind="obj1=R.Productivitiy" ng-model="R.Productivitiy" class="numericOnly " />
{{obj1}}
</td>
<td>
<input id="txtQuality" type="text" ng-model="R.Quality" class="numericOnly " />
</td>
<td>
<input id="txtCost" type="text" ng-model="R.Cost" class="numericOnly " />
</td>
<td>
<input id="txtDelivery" type="text" ng-model="R.Delivery " class="numericOnly " />
</td>
<td>
<input id="txtSafety" type="text" ng-model="R.Safety" class="numericOnly " />
</td>
<td>
<input id="txtEnvironment" type="text" ng-model="R.Environment" class="numericOnly " />
</td>
<td>
<input id="txtTechnology" type="text" ng-model="R.Technology" class="numericOnly " />
</td>
<td>
<input id="txtAesthetics" type="text" ng-model="R.Aesthetics " class="numericOnly " />
</td>
<td>
<input id="txtRPNNO" type="text" class="numericOnly" value="{{R.Productivitiy + R.Quality}}" disabled="disabled" />
</td>
<td>
<input id="txtCategorisationProblem" disabled="disabled" type="text" value="{{funCategorisationProblem()}}" />
</td>
</tr>
</table>
</div>
<input id="btnsave" type="button" value="Save" class="btn" ng-click="btnsave()" />
<script>
app.controller('spController', function ($scope, $http) {
$scope.ddlprocessOwnerChange = function () {
$scope.RespPerson = $scope.ddlprocessowner;
};
$scope.btnsave = function () {
alert($scope.R.Productivitiy);
};
}
</script>
答案 0 :(得分:1)
这是预期的。 R仅在ng-repeat范围内设置,表示当前(多次)迭代的人。
您的代码基本上等同于
var RespPerson;
function displayAll() {
for (R in RespPerson) {
// display R
}
}
function save() {
alert(R);
}
您看到上面的代码无法正常工作。 R仅在第一个函数的for循环中已知。
但是,你可以做的是将当前人作为你职能的参数:
$scope.btnsave = function (R) {
alert(R.Productivitiy);
};
并在视图中:
ng-click="btnsave(R)"
但是,当然,按钮必须再次内部 ng-repeat:每个人必须拥有自己的保存按钮,并且R仅在ng-repeat内可用。如果它在外面,按钮会保存多少人中的哪一个?
答案 1 :(得分:0)
这是一个基本的。在任何语言中,我们都不会尝试在迭代之外访问循环/迭代器变量。
在这里你正在迭代
http://www.w3schools.com/jquery/ajax_ajax.asp
每个RespPerson迭代的均值一个变量将创建为R,并且仅用于该迭代。不适合下一次迭代。因此,在迭代完成后,变量不在范围内。
现在使用
data-ng-repeat="R in RespPerson"
在您的按钮事件代码中。 R不再存在了。
你应该使用
alert($scope.R.Productivitiy);
答案 2 :(得分:0)
感谢您提供宝贵的时间。 终于得到了答案:)
这是工作代码
<div data-ng-repeat="R in RespPerson">
<fieldset class="info-box-gradient">
<legend>{{R.Title}} </legend>
<table cellpadding="0" cellspacing="0">
<tr class="_hdr">
<td>
<span>Root Cause Analysis </span>
<div class="_note">
Tick
<input id="Checkbox1" type="checkbox" checked="checked" disabled="disabled" />
to add Cause to Summary of Root Cause analysis
</div>
</td>
</tr>
<tr class="_labeltr" style="padding: 0px;">
<td>
<table cellpadding="0" cellspacing="0" style="margin: 0px; padding: 0px">
<tr>
<td>
<span>Man</span>
</td>
<td>
<span>Material </span>
</td>
<td>
<span>Method </span>
</td>
<td>
<span>Machine </span>
</td>
<td>
<span>Environment </span>
</td>
</tr>
<tr>
<td>
<input id="chkman1" type="checkbox" ng-model="chkman[R.id]" />
<textarea id="txtman1" cols="20" rows="2" ng-model="txtman[R.id]"></textarea>
</td>
<td>
<input id="chkMaterial1" type="checkbox" ng-model="chkMaterial[R.id]" />
<textarea id="txtMaterial1" cols="20" rows="2" ng-model="txtMaterial[R.id]"></textarea>
</td>
<td>
<input id="chkMethod1" type="checkbox" ng-model="chkMethod[R.id]" />
<textarea id="txtMethod1" cols="20" rows="2" ng-model="txtMethod[R.id]"></textarea>
</td>
<td>
<input id="chkMachine1" type="checkbox" ng-model="chkMachine[R.id]" />
<textarea id="txtMachine1" cols="20" rows="2" ng-model="txtMachine[R.id]"></textarea>
</td>
<td>
<input id="chkEnvironment1" type="checkbox" ng-model="chkEnvironment[R.id]" />
<textarea id="txtEnvironment1" cols="20" rows="2" ng-model="txtEnvironment[R.id]"></textarea>
</td>
</tr>
</table>
</td>
</tr>
<tr class="_hdr">
<td>
<span>Rating </span>
<div class="_note">
( 1 is lowest & 5 is Highest)
</div>
</td>
</tr>
<tr>
<td style="padding: 0px">
<table cellpadding="0" cellspacing="0" class="_tblrating" style="margin: 0px; padding: 0px">
<tr class="_labeltr">
<td>
<span>Productivitiy </span>
</td>
<td>
<span>Quality </span>
</td>
<td>
<span>Cost </span>
</td>
<td>
<span>Delivery </span>
</td>
<td>
<span>Safety </span>
</td>
<td>
<span>Environment </span>
</td>
<td>
<span>Technology </span>
</td>
<td>
<span>Aesthetics </span>
</td>
<td>
<span>RPN NO </span>
</td>
<td>
<span>Categorisation of Problem </span>
</td>
</tr>
<tr>
<td>
<input id="txtProductivitiy" type="text" ng-model="Productivitiy[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtQuality" type="text" ng-model="Quality[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtCost" type="text" ng-model="Cost[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtDelivery" type="text" ng-model="Delivery[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtSafety" type="text" ng-model="Safety[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtEnvironment" type="text" ng-model="Environment[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtTechnology" type="text" ng-model="Technology[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtAesthetics" type="text" ng-model="Aesthetics[R.id]" class="numericOnly " />
</td>
<td>
<input id="txtRPNNO" type="text" class="numericOnly" value="{{funRPNNO(R.id)}}" disabled="disabled" />
<input id="txtRPNTotal" type="text" ng-model="RPNTotal[R.id]" class="numericOnly" ng-show="False" />
</td>
<td>
<input id="txtCategorisationProblem" disabled="disabled" type="text" value="{{funCategorisationProblem(R.id)}}" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0">
<tr>
<td>
<span>Corrective action(CA) </span>
</td>
<td>
<span>Preventive action (PA) </span>
</td>
</tr>
<tr>
<td>
<textarea id="txtCorrectiveaction" cols="20" rows="2" ng-model="txtCorrectiveaction[R.id]"></textarea>
</td>
<td>
<textarea id="txtPreventiveaction" cols="20" rows="2" ng-model="txtPreventiveaction[R.id]"></textarea>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" style="margin: 0px; padding: 0px">
<tr>
<td>
<span>Effectiveness </span>
</td>
<td>
<span>Target </span>
</td>
<td>
<span>Actual Date </span>
</td>
<td>
<span>Review Date </span>
</td>
<td>
<span>Status of CA </span>
</td>
</tr>
<tr>
<td>
<textarea id="txtEffectiveness" cols="20" rows="2" ng-model="txtEffectiveness[R.id]"></textarea>
</td>
<td>
<input id="txtTarget" type="text" ng-model="txtTarget[R.id]" />
</td>
<td>
<input id="txtActualDate" type="text" ng-model="txtActualDate[R.id]" datepicker />
</td>
<td>
<input id="txtReviewDate" type="text" ng-model="txtReviewDate[R.id]" datepicker />
</td>
<td>
<select id="txtStatusofCA" ng-model="txtStatusofCA[R.id]">
<option selected="selected">Pending</option>
<option>Implemented</option>
<option>Non-Implemented</option>
</select>
</td>
</tr>
</table>
</td>
</tr>
</table>
</fieldset>
</div>
<input id="btnsave" type="button" value="Save" class="btn" ng-click="btnsave()" />
<script>
$scope.Productivitiy = {};
$scope.Quality = {};
$scope.Cost = {};
$scope.Delivery = {};
$scope.Safety = {};
$scope.Environment = {};
$scope.Technology = {};
$scope.Aesthetics = {};
$scope.RPNTotal = {};
app.controller('spController', function ($scope, $http) {
$scope.ddlprocessOwnerChange = function () {
$scope.RespPerson = $scope.ddlprocessowner;
};
$scope.btnsave = function () {
alert($scope.Productivitiy);//get all ng-model value of "Productivitiy" return array
};
}
</script>