Question

我是AngularJS的初学者，感谢Stackoverflow上的Angular社区，它愿意帮助像我这样的新手，我非常感谢它。非常感谢。

今天我想为昨天的练习添加一个功能（可以找到here）。我想保留用户输入的数字对的记录，并将其显示为行列表。为此，我介绍了一组数字对象。按下按钮可将当前对添加到阵列中。

目前，似乎数组只包含成员，无论我做什么来推动新成员。任何人都可以帮我找到我的错误吗？

var saApp = angular.module("saApp", []);

saApp.controller('numberController', function($scope) {
  $scope.numbers = [];

  $scope.number = {
    number1: 0,
    number2: 0,
    sumIt: function() {
      var numberObject;
      numberObject = $scope.number;
      return parseInt(numberObject.number1) + parseInt(numberObject.number2);
    }
  };

  $scope.pushIt = function() {
    if ($scope.number !== undefined)
      $scope.numbers.push($scope.number);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="saApp" ng-controller="numberController">
  <input type="text" ng-model="number.number1" placeholder="Enter a number here">

  <input type="text" ng-model="number.number2" placeholder="Enter another number here">

  <br />{{number.number1}} + {{number.number2}} = {{number.sumIt()}}

  <br />

  <br />
  <button ng-click="pushIt()">Push</button>

  <div ng-repeat="number in numbers">
    {{number.number1}} + {{number.number2}} = {{number.sumIt()}}

    <br />
  </div>

</div>

Answer 1

使用object将input字段作为ng-repeat推送到var saApp = angular.module("saApp", []); saApp.controller('numberController', function($scope) { $scope.numbers = []; $scope.pushIt = function() { var obj = { number1: 0, number2: 0, sumIt: function() { return parseInt(this.number1) + parseInt(this.number2); } } $scope.numbers.push(obj); } $scope.pushIt(); });。每个重复的对象都有自己的范围，并相应地更新招标值。

试试这个：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="saApp" ng-controller="numberController">
  <button ng-click="pushIt()">Push</button>
  <div ng-repeat="number in numbers">
    <input type="text" ng-model="number.number1" placeholder="Enter a number here">
    <input type="text" ng-model="number.number2" placeholder="Enter another number here">{{number.number1}} + {{number.number2}} = {{number.sumIt()}}
    <br />
  </div>
</div>

externals

Fiddle here

Answer 2

当前代码中的一处更改只是在推入$scope.number数组之前克隆$scope.numbers。

 $scope. pushIt = function() {
            if ($scope.number !== undefined)
                $scope.numbers.push(angular.copy($scope.number));
        }

为什么我们应该在推送前克隆。

$ scope.number对象始终相同，因此数组中的所有元素都将具有相同的$$ hashkey，您将获得此error

因此，您应该在推送之前克隆或复制对象，以便数组中包含新的元素对象。

工作代码here

Answer 3

GLib.Application.get_dbus_connection ()

用此代码替换你的pushIt功能

Angular范围变量中的数组只有一个成员

3 个答案: