Fatal编程技术网
  • javascript/
  • Javascript can'；t向我的简单JSON（$scope.customers）添加新数据

Javascript can'；t向我的简单JSON（$scope.customers）添加新数据

javascript json angularjs

Javascript can'；t向我的简单JSON（$scope.customers）添加新数据,javascript,json,angularjs,Javascript,Json,Angularjs,我刚刚开始学习angular.js，所以我真的是个新手。我不知道是否有语法问题或任何其他简单的问题，但我就是无法做到这一点 我已经开始了。我会用Rodrigo Branas的书 <html ng-app="customersApp"> <head> <title>App</title> <script src="angular.min.js"></script> <script>

我刚刚开始学习angular.js，所以我真的是个新手。我不知道是否有语法问题或任何其他简单的问题，但我就是无法做到这一点

我已经开始了。我会用Rodrigo Branas的书

<html ng-app="customersApp">
<head>
    <title>App</title>
    <script src="angular.min.js"></script>
    <script>
        var app = angular.module('customersApp', []);

        app.controller('CustomersController', function($scope){
            $scope.customers = [
                {"id": 1, "name": "Yusuf", "age": 18},
                {"id": 2, "name": "Ahmetcan", "age": 17},
                {"id": 3, "name": "Ender", "age": 20},
                {"id": 4, "name": "Batuhan", "age": 16},
            ];

            $scope.add = function (name){
                $scope.customers.push(angular.copy(name));
                delete $scope.name;
            };
        });
    </script>
</head>
<body>
    <input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add(nameTxt)" type="submit"/>
    <table ng-controller="CustomersController">
        <tr ng-repeat="cust in customers | filter:nameTxt">
            <td>{{cust.name}}</td>
            <td>{{cust.age}}</td>
        </tr>
    </table>
    <br/>
    You are looking for: {{nameTxt}}
</body>
</html>


应用程序
var app=angular.module（'customersApp'，[]）；
app.controller（'CustomersController'，函数（$scope）{
$scope.customers=[
{“id”：1，“姓名”：“优素福”，“年龄”：18}，
{“id”：2，“姓名”：“Ahmetcan”，“年龄”：17}，
{“id”：3，“姓名”：“Ender”，“年龄”：20}，
{“id”：4，“姓名”：“Batuhan”，“年龄”：16}，
];
$scope.add=函数（名称）{
$scope.customers.push（angular.copy（name））；
删除$scope.name；
};
});
{{cust.name}
{{cust.age}


您正在查找：{{nameTxt}
除了$scope.add函数外，其他所有功能都工作正常。我尝试的是获取nameTxt并将其添加到$scope.customers

我认为问题在于JSON数据结构和我试图添加的数据之间。但我不知道如何解决这个问题。已经，谢谢

编辑：

按照以下步骤操作：

<input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add()" type="submit"/>

$scope.add = function (){
     $scope.customers.push({"id":$scope.customers.length,"name":nameTxt,"age":"---fill---"});
};


$scope.add=函数（）{
$scope.customers.push（{“id”：$scope.customers.length，“name”：nameTxt，“age”：“--fill----”}）；
};
使用以下代码：

$scope.add = function (name){
                $scope.customers.push({'id':"",'name':name,'age':""});

            };
您的输入超出了控制器的范围，您还必须推送同类型客户的对象。您必须相应地计算项目的Id

我举了一个简单的例子

Html

<div ng-controller="CustomersController">
<input type="text" id="name" ng-model="nameTxt" />
<input ng-click="add(nameTxt)" type="submit" />
<table >
    <tr ng-repeat="cust in customers | filter:nameTxt">
        <td>{{cust.name}}</td>
        <td>{{cust.age}}</td>
    </tr>
</table>
<br/>You are looking for: {{nameTxt}}</div>


{{cust.name}
{{cust.age}


您正在查找：{{nameTxt}
var app=angular.module（'customersApp'，[]）；
app.controller（'CustomersController'，函数（$scope）{
$scope.customers=[
{“id”：1，“姓名”：“优素福”，“年龄”：18}，
{“id”：2，“姓名”：“Ahmetcan”，“年龄”：17}，
{“id”：3，“姓名”：“Ender”，“年龄”：20}，
{“id”：4，“姓名”：“Batuhan”，“年龄”：16}
];
$scope.add=函数（名称）{
$scope.customers.push（{“id”：“”，“name”：name，“age”：“”）；
};
});
问题的原因是我在哪里使用了“ng控制器”参数。我已经定义了标签的内部，但输入不在表的内部

我换了3行，问题解决了

<body>
我不知道为什么angular.copy不起作用。

我真的需要那么多代码？当我手动添加时，angularjs允许我在没有id和年龄的情况下添加。为什么不呢？有什么区别吗？如果你像这样放置
$scope.customers.push（angular.copy（name））
，你如何得到
cust.name
和
cust.age
？我只会得到名字。同样的结论，但太迟了1分钟。这里是plunkr：我还想添加一点，以确保您的控制器将您在其中定义的所有函数包装在HTML中。在你的例子中，add（nameTxt）在你的controller div之外，但是Max在他的演示中更正了它。我刚刚意识到这不是关于JSON的，而是关于我定义ng controller=“CustomersController”的地方。在我在标签中定义这个参数后，问题解决了。@Max根据stackoverflow，我需要等待2天才能将我的答案标记为已解决。 
<div ng-app="customersApp"> 
<input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add(nameTxt)" type="submit"/>
    <table ng-controller="CustomersController">
        <tr ng-repeat="cust in customers | filter:nameTxt">
            <td>{{cust.name}}</td>
            <td>{{cust.age}}</td>
        </tr>
    </table>
    <br/>
    You are looking for: {{nameTxt}}
</div>

    var app = angular.module('customersApp', []);

    app.controller('CustomersController', function($scope){
        $scope.customers = [
            {"id": 1, "name": "Yusuf", "age": 18},
            {"id": 2, "name": "Ahmetcan", "age": 17},
            {"id": 3, "name": "Ender", "age": 20},
            {"id": 4, "name": "Batuhan", "age": 16}
        ];

        $scope.add = function (name){
        $scope.customers.push({"id":'',"name":name,"age":''});

        };
    });

<body>

 <body ng-controller="CustomersController">

$scope.add = function (name){
                $scope.customers.push({"name": name});
            };