gpt4 book ai didi

javascript - 创建一个表单并编辑该表单但不保存(以 Angular 形式)?

转载 作者:行者123 更新时间:2023-12-03 11:53:06 24 4
gpt4 key购买 nike

嗨, friend 们,我已经创建了一个表单并显示它,如果我单击“编辑按钮”,按钮表单将打开并显示我编辑表单并单击“保存”按钮,此按钮不起作用,并且不保存数据帮帮我

代码

// Code goes here

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

app.controller('portfolioController', function($scope) {
$scope.portofoliosBox = [{
title: "Finance Projects",
description: "# of projects Count Sum Aggregate 1"
}, {
title: "Marketing Projects",
description: "# of projects Count Sum Aggregate 2"
}, {
title: "Finance Projects",
description: "# of projects Count Sum Aggregate 3"
}, {
title: "Marketing Projects",
description: "# of projects Count Sum Aggregate 4"
}, {
title: "Finance Projects",
description: "# of projects Count Sum Aggregate 5"
}];

$scope.editFormPortFolio = function(portfolioBox) {
editFormPorfolio = true;
portfolioBox.title = portfolioBox.title;
portfolioBox.description = portfolioBox.description;
}


});

HTML 代码

<body ng-app="theme">
<div ng-controller="portfolioController">
<div ng-repeat="portfolioBox in portofoliosBox">
<button ng-click="editFormPorfolio=true" ng-show="!editFormPorfolio">Edit Button</button>
<h5 ng-show="!editFormPorfolio">{{portfolioBox.title}}</h5>
<p ng-show="!editFormPorfolio">{{portfolioBox.description}}</p>


<form ng-show="editFormPorfolio" ng-submit="editFormPortFolio(portfolioBox)">
<label class="edit-pencil">
<button>Save</button>
<input type="submit" ng-show />
</label>
<input type="text" ng-model="portfolioBox.title" />
<textarea row="5" cols="" ng-model="portfolioBox.description"></textarea>
</form>

</div>


</body>

<强> Demo

最佳答案

使用portfolioBox的“编辑”属性

portfolioBox.edit = true

以及保存时

portfolioBox.edit = false

http://plnkr.co/edit/pZSqcTJolkJk7buTGkvf?p=preview

关于javascript - 创建一个表单并编辑该表单但不保存(以 Angular 形式)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25722395/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com