[英]ng-repeat not working with array
我是AngularJs和Javascript的新手,所以我会尽力解释这个问题。 我的Angular控制器从我的MVC控制器中的方法接收数据。 每次运行脚本时,MVC控制器都会返回1个项目。 每次在无序列表中使用ng-repeat返回新项目时,我都会尝试动态扩展html页面中的项目列表。 当我使用ng-repeat时,第一项不会显示,直到添加第二项,然后它们都显示在一起。 如果我添加第3项,则项目显示奇怪。 以下是使用ng-repeat进行迭代的示例:
迭代1:
空白
迭代2:
第1项
第2项
迭代3:
[“Item1”,“Item2”]
第3项
第三次迭代字面上显示括号和引号,而不是无序列表的项目符号。 谁能告诉我发生了什么?
这是Angular控制器代码:
$scope.addState = function () {
//debugger;
companyService.addState($scope.form)
.success(function (data) {
if (pass == 0) {
$scope.addedStates = data;
pass = pass + 1;
}
else {
addedStates = [
angular.copy($scope.addedStates),
data
];
$scope.addedStates = addedStates;
}
$scope.rmgStates = $scope.rmgStates - 1;
if($scope.rmgStates == 0)
{
$scope.canSubmit = true;
$scope.lastState = false;
}
else {
$scope.canSubmit = false;
$scope.lastState = true;
}
})
};
这是html代码:
You have added the following States:<br />
<ul>
<li ng-repeat="item in addedStates">
{{item}}
</li>
</ul>
非常感谢任何和所有的帮助。
问题是,在第一次传递时,您将addedStates设置为添加的单个状态 - 因为ng-repeat期望和数组,它没有显示任何内容。 在第一个之后的传递中,你获取了之前的添加状态,用数组包装它,然后随着新状态插入一个数组,因此每次都更深层次 - 这就是为什么它第二次显示正确的格式,但第三,它是一个数组中的数组。
相反,您应该初始化并清空数组,并在每个成功的请求上添加状态,只需将新状态推入现有数组即可。
尝试这个:
$scope.addedStates = [];
$scope.addState = function () {
//debugger;
companyService.addState($scope.form)
.success(function (data) {
$scope.addedStates.push(angular.copy(data));
$scope.rmgStates = $scope.rmgStates - 1;
if($scope.rmgStates == 0)
{
$scope.canSubmit = true;
$scope.lastState = false;
}
else {
$scope.canSubmit = false;
$scope.lastState = true;
}
})
};
在数组中添加新项的方法如下。 采用:
$scope.addedStates.push(data);
代替:
if (pass == 0) {
$scope.addedStates = data;
pass = pass + 1;
}
else {
addedStates = [
angular.copy($scope.addedStates),
data
];
$scope.addedStates = addedStates;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.