创建表单并编辑表单但不保存（角度）？答案

【问题标题】：create a form and editing the form but not save (in angular )?创建表单并编辑表单但不保存（角度）？
【发布时间】：2014-09-08 10:40:56
【问题描述】：

嗨朋友我已经创建了一个表单并显示它如果我单击“编辑按钮”按钮表单将打开并显示我编辑表单并单击按钮“保存”此按钮无效并且不保存数据请帮帮我

代码

// 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

【问题讨论】：

标签： javascript angularjs forms angularjs-directive angularjs-ng-repeat

【解决方案1】：

对投资组合框使用“编辑”属性

portfolioBox.edit = true

以及保存时

portfolioBox.edit = false

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

【讨论】：