将p标记更改为输入
我正在使用AngularJS构建一个小的SPA。来自jQuery背景的我在AngularJS中遇到了诸如DOM操作(或缺乏DOM)之类的问题。我有一个ng重复，它创建了tr-我想要发生的事情，是当终端用户单击td中的一个p标记时，它会转换成一个可编辑的输入字段。
发自：
在p标记上单击：
下面是我目前的代码：
index.html
<tr ng-repeat="test in tests"> <td> <span ng-click='edit()'>{{test.name}}</span> </td> </tr>
controllers.js
$scope.edit = function() { something in here that will help me convert to input type='text' }
我想我需要使用指令，所以如果有人能指出正确的方向，或者让我知道我能做什么，那将是非常感谢的。
谢谢你的帮助。
回答 2
Stack Overflow用户
发布于 2014-09-30 06:57:21
非常简单，您可以使用ng-hide和ng-show以及isEditing标志：
<tr ng-repeat="test in tests">
<td>
<span ng-show="!isEditing" ng-click='isEditing = !isEditing'>{{test.name}}</span>
<input type="text" ng-show="isEditing" ng-model="test.name" />
</td>
</tr>您将需要添加一个按钮来保存编辑，并将isEditing标志翻转回去--但除此之外，这应该是可行的。
Stack Overflow用户
发布于 2014-09-30 07:05:08
角度的方法是使用ng类，它可以根据$scope中的布尔对象来决定dom对象的类。
简单地说，您预先创建了输入字段，但是它从隐藏它的类开始(display:none)。单击p标记时，在$scope中设置一个布尔值，例如，“showField1”为true，ng类将输入字段的类更改为带display:block的类。
您对p标记也是这样做的，它以显示:块开头，但当您单击它时，ng类可以将该类切换到另一个显示:隐藏的类。
很简单。你不需要指令。
https://stackoverflow.com/questions/26123803
复制
腾讯云开发者
