Angular form存储不能处理动态推送数据
Angular form存储不能处理动态推送数据
提问于 2017-03-30 18:38:13
我对angular是个新手，并且坚持使用动态数据绑定。我有4个数据字段，2个是静态的，2个是在添加按钮后动态添加的。当我单击add按钮时，显示屏上只显示两个字段，其余数据不会填充。我可能在数据传递过程中犯了一些错误。前两个字段是静态的，后两个字段是动态的，需要在用户单击时添加。使用form时也会发生同样的情况。有谁能帮我解决这个问题吗。提前谢谢。下面是我的代码：
控制器：
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.items = [];
$scope.itemsToAdd = [{
firstName: '',
lastName: ''
}];
$scope.add = function(itemToAdd) {
var index = $scope.itemsToAdd.indexOf(itemToAdd);
$scope.itemsToAdd.splice(index, 1);
$scope.items.push(angular.copy(itemToAdd))
}
$scope.addNew = function() {
$scope.itemsToAdd.push({
firstName: '',
lastName: ''
})
}
});视图(HTML)：
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="plunker" ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
<div ng-repeat="item in items">
{{item.regno}} {{item.section}}
{{item.firstName}} {{item.lastName}}
</div>
<input type="text" ng-model="itemToAdd.regno" />
<input type="text" ng-model="itemToAdd.section" />
<div ng-repeat="itemToAdd in itemsToAdd">
<input type="text" ng-model="itemToAdd.firstName" />
<input type="text" ng-model="itemToAdd.lastName" />
<button ng-click="add(itemToAdd)">Add</button>
</div>
<div>
<button ng-click="addNew()">Add new</button>
</div>
</body>Stack Overflow用户
发布于 2017-03-30 18:41:00
您可以在添加后尝试：
$scope.$apply();页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43115417
复制相关文章
相似问题
腾讯云开发者
