如何使用angular.js在一个div中添加多个div

时间:2013-10-25 12:43:31

标签: javascript jquery angularjs

我是Anjular.js的新手。我今天刚开始学习,所以我希望你能帮助我。

我有这样的html文件:

<div ng-conrtoller="add">
  <div >
    <div>{{ username }}</div>
  <div>
  <input type="text" ng-model="name">
  <button ng-click="addname">save</button>
</div>

在controller.js文件中:

app.controller("add",function($scope)
{
    $scope.addname=function()
    {
        $scope.username=$scope.name;
    } 
});

在我将文本输入文本字段后单击“保存”按钮时,输入的文本将显示在一个div中。如果我再次这样做,名称将被替换,但我想显示以前输入的文本以及将来输入的任何文本。

感谢。

1 个答案:

答案 0 :(得分:0)

i want to display previously entered text as well as in future enter text

您可以使用数组存储多个项目,将项目推送到数组并使用ngRepeat

HTML

<div>
    <div ng-repeat="username in usernames">{{ username }}</div>
<div>
<input type="text" ng-model="name">
<button ng-click="addname()">save</button>

JS

$scope.usernames = [] ;
$scope.addname=function()      {
    $scope.usernames.push($scope.name);
    $scope.name = "";
} 

Working Demo

目前仅使用唯一的项目进行测试