Javascript 添加元素后无法将元素添加到数组中_Javascript_Arrays_Angularjs

Javascript 添加元素后无法将元素添加到数组中

javascript arrays angularjs

Javascript 添加元素后无法将元素添加到数组中,javascript,arrays,angularjs,Javascript,Arrays,Angularjs,我正在尝试AngularJS，而且对它非常陌生 <html ng-app="DemoApp"> <head> <script src="/Angular/jslibs/angular.js"></script> <script src="/Angular/app/app.js"></script> <script src="/Angular/app/services/personData.js"></scr

我正在尝试AngularJS，而且对它非常陌生

<html ng-app="DemoApp">
<head>
<script src="/Angular/jslibs/angular.js"></script>
<script src="/Angular/app/app.js"></script>
<script src="/Angular/app/services/personData.js"></script>

<meta charset="ISO-8859-1">
<title>Angular Example</title>
</head>
<body>

    <div ng-controller="userCtrl">
        <h2>Actor List:</h2>
        <hr>
        <ul ng-repeat="person in persons">
            <li>{{person.name}} in {{person.city}}
                <button ng-click="removeActor($index)">Delete</button>
            </li>
        </ul>
        <hr>
        <input type="text" placeholder="Name" ng-model="actor.name" /> <input
            type="text" placeholder="City" ng-model="actor.city" />
        <button ng-click="addActor()">Add</button>

    </div>

</body>
</html>

personData.js：

demoApp.factory("personData", function() {

    var actor = {
        name : "",
        city : ""
    };

    var persons = [ {
        name : "User1",
        city : "Location1"
    }, {
        name : "User2",
        city : "Location2"
    }, {
        name : "User3",
        city : "Location3"
    } ];

    return {

        addActor : function() {
            persons.push(actor);
            actor = {
                name : "",
                city : ""
            };
        },

        removeActor : function(index) {
            persons.splice(index, 1);
        },

        getPersons : function() {
            return persons;
        },

        getActor : function() {
            return actor;
        }

    }
});

我的问题是，在添加一个元素之后，我无法向数组中添加元素。即使将actor设置为“”后，对文本的任何更改都会更改数组中的值

使用$scope.addActor=personData.addActor（）因为addActor是函数在控制器中，您没有调用函数

在控制器中，您必须创建函数$scope.addActor（）；因为您调用了ng，所以单击addActor（）

控制器：

第一条语句将personData对象分配给

$scope.actor

当您调用

addActor

时，您将该actor推送到数组中，并创建一个新对象，但

$scope.actor

仍指向原始actor对象

改为：

$scope.addActor = function() {
    personData.addActor();
    $scope.actor = personData.getActor();
}

尝试在控制器中创建函数，并传递要添加的actor对象

$scope.addActor = function(){
  personData.addActor($scope.actor);
    };

为您效劳

addActor : function(actor) {
 persons.push(actor);
  },

不要每个人都使用相同的名称你可以更具体一点，只需在控制器中使用give函数并删除$scope.addActor=personData.addActor；这条线，让我知道它是否工作

$scope.addActor = function() {
    personData.addActor();
    $scope.actor = personData.getActor();
}

$scope.addActor = function(){
  personData.addActor($scope.actor);
    };

addActor : function(actor) {
 persons.push(actor);
  },