添加行使用AngularJS形式 [英] Adding lines to a form using AngularJS
问题描述
我想创建一个用户可以preSS的+号，并添加新线路的形式。我通过调用函数单击按钮时，然后推一个新行到数组做到这一点。不被创建的新线，但是。下面这个函数删除线似乎是工作。
下面是JS：
VAR对myApp = angular.module（'对myApp'，[]）;myApp.controller（'myController的'，['$范围，$ Q'，函数（$范围，$ Q）{
$ scope.arr = [1,2];
$ scope.addLine =功能（指数）{
$ scope.arr.push（）;
}
$ scope.removeLine =功能（指数）{
$ scope.arr.splice（指数，1）;
}
}]）;
您需要的东西推到数组。
推（）定义和用法：
推送（）方法增加了新的项目，一个数组的结尾，并返回新的长度。
注：新项目（S）将在数组末尾添加
请注意：这种方法改变了数组的长度
提示：要在一个数组的开头添加项目，使用的unshift（）方法
http://www.w3schools.com/jsref/jsref_push.asp
VAR对myApp = angular.module（'对myApp'，[]）;\r
\r
myApp.controller（'myController的'，['$范围'，\r
功能（$范围）{\r
\r
$ scope.arr = [1，2];\r
$ scope.addLine =功能（指数）{\r
$ scope.arr.push（指数）;\r
}\r
$ scope.removeLine =功能（指数）{\r
$ scope.arr.splice（指数，1）;\r
}\r
}\r
]）; \r
＆LT;！DOCTYPE HTML＆GT;\r
＆LT; HTML NG-应用=对myApp＆GT;\r
\r
＆LT; HEAD＆GT;\r
＆LT;标题＆GT;您好AngularJS＆LT; /标题＆GT;\r
＆所述; SCRIPT SRC =https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js＆GT;＆下; /脚本＆GT;\r
＆LT; /头＆GT;\r
\r
＆LT;身体GT;\r
＆LT; DIV NG控制器=myController的＆GT;\r
＆LT;按钮名称=addLineNG点击=addLine（arr.length + 1）＆gt;添加线474; /按钮＆GT;\r
{{ARR | JSON}}\r
\r
＆LT; UL＆GT;\r
＆LT;李数据-NG-重复=X在ARR＆GT;\r
{{X}} - ＆LT;按钮名称=addLineNG点击=removeLine（$指数）＆GT;删除线474; /按钮＆GT;\r
＆LT; /李＆GT;\r
＆LT; / UL＆GT;\r
\r
＆LT; / DIV＆GT;\r
＆LT; /身体GT;\r
\r
＆LT; / HTML＆GT; \r
I am trying to create a form that users can press the '+' sign and add a new line. I do this by calling a function when a button is clicked and then pushing a new line into the array. The new lines are not being created, however. The function below that removes the line seems to be working.
Here is the js:
var myApp = angular.module('myApp', []);
myApp.controller('myController', ['$scope', '$q', function($scope, $q) {
$scope.arr = [1,2];
$scope.addLine = function(index){
$scope.arr.push();
}
$scope.removeLine = function(index){
$scope.arr.splice(index, 1);
}
}]);
You need to push something into the array.
Push() Definition and Usage: The push() method adds new items to the end of an array, and returns the new length.
Note: The new item(s) will be added at the end of the array.
Note: This method changes the length of the array.
Tip: To add items at the beginning of an array, use the unshift() method.
http://www.w3schools.com/jsref/jsref_push.asp
var myApp = angular.module('myApp', []);
myApp.controller('myController', ['$scope',
function($scope) {
$scope.arr = [1, 2];
$scope.addLine = function(index) {
$scope.arr.push(index);
}
$scope.removeLine = function(index) {
$scope.arr.splice(index, 1);
}
}
]);
<!doctype html>
<html ng-app="myApp">
<head>
<title>Hello AngularJS</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-controller="myController">
<button name="addLine" ng-click="addLine(arr.length+1)">Add Line</button>
{{ arr | json}}
<ul>
<li data-ng-repeat="x in arr">
{{ x }} - <button name="addLine" ng-click="removeLine($index)">Remove Line</button>
</li>
</ul>
</div>
</body>
</html>
这篇关于添加行使用AngularJS形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
