就地编辑内容编辑
使用ng-repeat什么是能够编辑内容的最佳方法？
在我理想的情况下， 添加的 生日将是一个超链接，点击该链接将显示一个编辑表单-与带有更新按钮的当前添加表单相同。
实时预览（插播）
HTML：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>Custom Plunker</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<script src="app.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.0/css/bootstrap-combined.min.css"
rel="stylesheet">
</head>
<body ng-app="birthdayToDo" ng-controller="main">
<div id="wrap">
<!-- Begin page content -->
<div class="container">
<div class="page-header">
<h1>Birthday Reminders</h1>
</div>
<ul ng-repeat="bday in bdays">
<li>{{bday.name}} | {{bday.date}}</li>
</ul>
<form ng-show="visible" ng-submit="newBirthday()">
<label>Name:</label>
<input type="text" ng-model="bdayname" placeholder="Name" ng-required/>
<label>Date:</label>
<input type="date" ng-model="bdaydate" placeholder="Date" ng-required/>
<br/>
<button class="btn" type="submit">Save</button>
</form>
</div>
<div id="push"></div>
</div>
<div id="footer">
<div class="container">
<a class="btn" ng-click="visible = true"><i class="icon-plus"></i>Add</a>
</div>
</div>
</body>
App.js：
var app = angular.module('birthdayToDo', []);
app.controller('main', function($scope){
// Start as not visible but when button is tapped it will show as true
$scope.visible = false;
// Create the array to hold the list of Birthdays
$scope.bdays = [];
// Create the function to push the data into the "bdays" array
$scope.newBirthday = function(){
$scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate});
$scope.bdayname = '';
$scope.bdaydate = '';
};
});
问题答案：
您应该将表单放在每个节点内，分别使用ng-show和ng-hide启用和禁用编辑。像这样：
<li>
<span ng-hide="editing" ng-click="editing = true">{{bday.name}} | {{bday.date}}</span>
<form ng-show="editing" ng-submit="editing = false">
<label>Name:</label>
<input type="text" ng-model="bday.name" placeholder="Name" ng-required/>
<label>Date:</label>
<input type="date" ng-model="bday.date" placeholder="Date" ng-required/>
<br/>
<button class="btn" type="submit">Save</button>
</form>
</li>
这里的关键点是：
- 我已将控件更改
ng-model为本地范围 - 已添加
ng-show到，form因此我们可以在编辑时显示它 - 添加了
span带有的，ng-hide以便在编辑时隐藏内容 - 添加了
ng-click，可以在其他任何元素中切换editing到true - 更改
ng-submit为切换editing到false
这是您更新的Plunker。
-
我试图找出是否可以在单个sed命令中编辑文件，而不需要手动将编辑的内容流式传输到新文件中，然后将新文件重命名为原始文件名。我尝试了选项，但我的Solaris系统说是非法选项。有别的方法吗？
-
通常，您不会在Vim中编辑文件。如果运行、编辑、写入和退出，则vim将取消的链接，并创建一个新文件和一个名为的新链接。但是，如果文件有多个链接，那么实际上会修改该文件。例如： 我一直在寻找一种真正编辑文件的方法，似乎有两种选择。使用，或使用，但要确保在编辑之前至少有两个指向该文件的链接。我想这个问题是学术性的，因为如果只有一个链接，vim创建一个新文件并不重要，如果在编辑过程中创建链接，vim似乎
-
介绍 收货地址编辑组件，用于新建、更新、删除收货地址。 引入 import { createApp } from 'vue'; import { AddressEdit } from 'vant'; const app = createApp(); app.use(AddressEdit); 代码演示 基础用法 <van-address-edit :area-list="areaList"
-
地物编辑 地物编辑指对点、线、面等几何对象进行编辑设置，如线型、颜色、线宽等。如果没有自定义设置几何图形的样式，交互控件也会用默认样式进行绘制。 //实例化地物编辑参数类 var addFeatureParams = new SuperMap.EditFeaturesParameters({ features: pointFeature, dataSourceName: "Worl
-
单击地图列表右侧的编辑地图，或者新建地图会自动进入地图编辑模块。编辑地图时无需特意保存您的修改，系统会根据您的操作自动将信息保存到服务器中。 本章节将详细介绍如果新建地图以及对地图进行编辑。单击下一页开始详细了解。 3.1 界面说明 3.2 添加图层 3.3 图层列表 3.4 图元列表 3.5 设置图层样式 3.6 查看图元数据 3.7 图层更多设置 3.8 修改图元 3.9 查看及修改图例 3.
-
单击地图列表后边的编辑按钮，会进入编辑状态，可以对地图进行图层添加，样式设置等。详细操作请查看“编辑地图”章节。