更改附加每个文本

我没有正确使用append事件获得结果，而不是使用ng-repeat添加每个名称。你能帮我一下，我怎么改变从一个输入字段添加每个名字。告诉我，在这里不使用ng-repeat，因为ng-repeat功能对我来说并不适用于我的进一步运行功能，如果可以不使用ng-repeat，则可以使用jquery或javascript解决此问题。在此先感谢.. Here is JSBin 更改附加每个文本

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

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

 
    $scope.my = {name: 'untitled'}; 
 
     $scope.add_Name = function (index) { 
 
     var namehtml = '<label ng-click="selectName($index)">{{my.name}} //click<br/></label>'; 
 
     var name = $compile(namehtml)($scope); 
 
     angular.element(document.getElementById('add')).append(name); 
 
    }; 
 
    
 
    $scope.selectName = function (index) { 
 
     $scope.showName = true; 
 
    }; 
 

 
});

<!DOCTYPE html> 
 
<html ng-app="myapp"> 
 

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

 
<body ng-controller="AddCtrl"> 
 
\t <button ng-click="add_Name($index)">Add Names</button> 
 
\t <div id="add"></div><br/> 
 

 
\t <form ng-show="showName"> 
 
     <label>Name Change(?)</label><br/> 
 
\t <input ng-model="my.name"> 
 
\t </form> 
 
</body> 
 

 
</html>

来源

2016-01-12 Vijju Sena

使用不同的名称为NG-模型文本框以及标签。 ** my.name **用作文本框的ng-model。在所有标签中，您提到了** {{my.name}} **。因为它更新了所有标签的价值。 – Thangadurai

@ user3141852然后如何给文本表达式，如果我给它不同的名称它不绑定到标签... –

@ user3141852如何文本框将捕获确切的标签值...如何给数组附加值？如何更改文本框中的表达式名称？ –

ng-repeat将是完美的这样的情况。不知道是什么让你避免这种情况。

你可以有一个counter这将增加每Name时间被添加。同样通过counter name作为selectName函数的参数。

每次selectName被调用，参数值将被设置为model

试试这个：

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

 
app.controller('MainCtrl', function($scope, $compile) { 
 
    $scope.my = { 
 
    name: 'untitled' 
 
    }; 
 
    var counter = 0; 
 
    $scope.add_Name = function(index) { 
 
    var myName = 'untitled' + counter; 
 
    var namehtml = '<label ng-click="selectName(\'' + myName + '\')">' + myName + ' //click<br/></label>'; 
 
    var name = $compile(namehtml)($scope); 
 
    angular.element(document.getElementById('add')).append(name); 
 
    ++counter; 
 
    }; 
 

 
    $scope.selectName = function(val) { 
 

 
    $scope.my.name = val; 
 
    $scope.showName = true; 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 

 
<body ng-app="plunker" ng-controller="MainCtrl"> 
 
    <button ng-click="add_Name($index)">Add Names</button> 
 
    <div id="add"></div> 
 
    <br/> 
 

 
    <form ng-show="showName"> 
 
    <label>Name Change(?)</label> 
 
    <br/> 
 
    <input ng-model="my.name"> 
 
    </form> 
 
</body>

Working demo

来源

2016-01-12 07:08:50 Rayon

多数民众赞成在@RayonDabre ..但如果我保存在窗体中添加的名称，如果打开保存的形式添加的数据没有显示..如果我们再次添加它是添加多次..我该如何解决这个问题..请告诉我..我正在等待你的回复 –

非常感谢你@RayonDabre .. itz完美的工作.. thnax很多为你的努力... –

嗨@RayonDabre但它是绑定..它不会改变从标签从文本框 –

更改附加每个文本

回答

相关问题