个人中心
gpt4 book ai didi

javascript - Angular 形式保存不适用于动态推送数据

转载 作者：太空宇宙 更新时间：2023-11-04 15:51:01 25 4
gpt4 key购买 nike

我是 Angular 新手，并且一直坚持动态数据绑定(bind)。我有四个数据 字段 2 是静态的，字段 2 是在添加按钮后动态添加的。当我点击添加时 按钮仅两个字段显示在显示屏上，其余数据 未填充。我可能在数据传递中犯了一些错误。 前两个字段是静态的，后两个字段是动态的，需要添加为 用户点击。使用表单时也会发生同样的情况。 有人请帮我解决这个问题吗？提前致谢。 下面是我的代码:

Controller : 
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>

最佳答案

添加后即可尝试:

$scope.$apply();

关于javascript - Angular 形式保存不适用于动态推送数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43115417/

25 4 0
文章推荐： c++ - 尝试删除列表中的指针会导致内存使用量不断增长
文章推荐： javascript - 使用 jquery 调整宽度，使 p 元素高 4 行
文章推荐： c++ - cin>> 不适用于 getline()
文章推荐： css - 如何在 WordPress 小部件中注册样式表？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com