[英]How to create a dom element to another Template?
I have an example of a script. 我有一个脚本示例。 In short - if you click on "add" creates a number of new elements as it was filled fields. 简而言之-如果单击“添加”,则会在填充字段时创建许多新元素。 Used ionic. 用过的离子。 It is necessary to make sure that when you click on "add" to open a new template, and already there to create elements. 有必要确保当您单击“添加”以打开新模板时,已经在其中创建元素。 But not now. 但是不是现在。
<!DOCTYPE html>
<html ng-app='main.app'>
<head>
<link data-require="bootstrap@3.3.2" data-semver="3.3.2" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller='AppController as AppCtrl'>
<div class="list">
<label class="item item-input" ng-repeat="item in AppCtrl.items track by $index">
<span class="input-label">Input</span>
<input type="text" ng-model="item.text">
</label>
</div>
<a class="btn btn-default" ng-click="AppCtrl.AddItems()">Add</a>
</body>
</html>
angular.module('main.app', [])
.controller('AppController',function(){
var self = this;
self.items = [{text:''},{text:''},{text:''},{text:''},{text:''}];
self.AddItems = function(){
var empty = 0;
for(var i = 0; i < self.items.length; i++){
if(self.items[i].text == ''){
empty++;
}
}
empty = 5-empty;
for(var i = 0; i < empty; i++){
self.items.push({text:''});
}
}
});
I may have misunderstood your needs, but it looks you have a small confusion with your empty
variable. 我可能误解了您的需求,但看起来您对empty
变量有些困惑。
In your last for iteration, empty
is 0
and then no items are added to your array. 在你最后的迭代 , empty
为0
,然后没有任何项目添加到您的阵列。
For example, if you change your for condition to: 例如,如果将for条件更改为 :
for(var i = 0; i < 5; i++){
self.items.push({text:''});
}
You have the items added to your array and to your html. 您已将项目添加到数组和html中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.