从单一来源更改类似的ng-repeat值

时间:2016-01-14 08:14:28

标签: javascript jquery angularjs

我想从显示的单个输入文本框中单独更改ng-repeat值。我试图将inputbox绑定到label,但所有值绑定在一起。

如何仅更改选定的div值?我不想使用ng-repeat来添加值。

如果不在启动时使用ng-repeat再添加,我怎么能这样做,你可以使用ng-repeat其他功能。表格应显示在某个位置,以将输入框中的值更改为标签。 Working DEMO



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

app.controller('AddCtrl', function ($scope, $compile) {

   		$scope.items = [];
        $scope.add_New = function (index) {
        var itemhtml = '<div ng-click="select()" class="content">//click here first// <div ng-repeat="item in items">{{$index + 1}}. {{item.name}}</div></div>';
        var item = $compile(itemhtml)($scope);
        angular.element(document.getElementById('drop')).append(item);
          };
        $scope.add = function () {
          $scope.items.push({ 
            name: "hi"
          });
        };
        $scope.select = function(){
          $scope.showItem = true;
        }
});
&#13;
.add{
  position: absolute; height: auto; width: 200px; left: 0; right: auto; top: 0; bottom: 0;
}
.show{
  position: absolute; width: auto; left: 200px; right: 0; top: 0; bottom: 0;
    border:1px solid red;
float:right;
}
.content{
  border:1px solid blue;
}
&#13;
<!DOCTYPE html>
<html ng-app="myapp">

<head>
          <link href="style.css" rel="stylesheet" type="text/css"/>

	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular.min.js"></script>
	<script src="https://code.angularjs.org/1.5.0-rc.0/angular-sanitize.min.js"></script>
</head>

<body ng-controller="AddCtrl">
	<div class="add"><button ng-click="add_New($index)">add Again</button>
    <div id="drop">
        </div>
      </div>
      <div ng-show="showItem" class="show">
          <div ng-repeat="item in items">
            {{$index + 1}}.<input type="text" ng-model="item.name">
            </div>
            <button ng-click="add()">Add</button>

          </div>
</body>

</html>
&#13;
&#13;
&#13;

0 个答案:

没有答案