所以我想知道是否有可能在一个 span 上有一个 ng-click 语句,当点击时会用指令(及其模板、绑定(bind)等)替换 span 内容?
例子
<div class="col-xs-12">
<span ng-click="edit"> {{ user.name }} - {{ user.lastWin }} </span>
<button ng-click="removeUser(user.name)" class="btn btn-danger pull-right margin-right-10">Remove User</button>
</div>
那么编辑将是这样的:
<form name="editUser">
<input type="text" name="name" ng-model="name" placeholder="Name"/>
<input type="text" ng-model="lastWin" placeholder="Last Win"/>
</form>
<button ng-click="editUser($index, { name: name, lastWin: lastWin })" class="btn">Save</button>
我必须在我的 Controller 上做什么才能让它正确交换所有内容?
最佳答案
我会使用 ng-if
并在没有额外的 javascript 的情况下完成整个事情
像这样:
<div class="col-xs-12" ng-if="!edit">
<span ng-click="edit = true"> {{ user.name }} - {{ user.lastWin }} </span>
<button ng-click="removeUser(user.name)" class="btn btn-danger pull-right margin-right-10">Remove User</button>
</div>
<div ng-if="edit">
<form name="editUser">
<input type="text" name="name" ng-model="name" placeholder="Name"/>
<input type="text" ng-model="lastWin" placeholder="Last Win"/>
</form>
<button ng-click="editUser($index, { name: name, lastWin: lastWin })" class="btn">Save</button>
</div>
关于javascript - ng-click 用 Angular Directive(指令)替换 DOM 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22773989/