anglejsのユーザの選択に応じて編集して更新する方法

Question

リストから選択したアイテムを別のhtmlビューで編集しようとしているので、save buttonをクリックすると、変更がmain viewのリストに反映されます。編集私はtitle、description、fromおよびtoの編集日付を使用しています。私はここでアイデアを打ち明かしました。つまり、ユーザーが4つの詳細のいずれかを編集して残りの詳細を同じに保存したい場合はどうしましたかそれはng-modelであるが、編集された詳細のみを読み取ることができるが、既存のものは読み取ることができない。だから私はこれについて助けを求めている。

HTML：

<div align="center"> 
      Title 
      <input type="text" ng-model="selectInput.Title"> 
      Offer: 
      <input type="text" ng-model="selectInput.data.description"> 
      Valid from: 
      <input type="date" ng-click="FromDate()" ng-model="frDate"> 
      <br> Valid till: 
      <input type="date" ng-click="ToDate()" ng-model="toDate" /> 
     </div> 
     <hr> 
     <button ng-click='SaveEdit($index)' ng-model="editSave"> Save</button> 

コントローラ：

$scope.items = []; 
    $rootScope.couponList = [{ Title: "Fruit Export Details" data: {description: "consume soon product", Fromdate: "2016-09-09", Todate: "2016-09-18"}}, 
    {Title: "Vegetables Export Details", data:{description: "consume soon product", Fromldate: "2016-11-09", Todate: "2016-10-19"}}, 
    { CouponTitle: "Saviours",data:{description: "storable", Fromldate: "2016-09-10", Todate: "2016-10-09"}}]; 

    $scope.select_item = function (key) { 
    //alert(key); 
    $scope.items.push(key); 

    } 
    $scope.SaveEdit=function(){ 
      $scope.Title=$scope.selectInput.data.Title; 
     $scope.description=$scope.selectedInput.data.description; 
     $scope.Fromdate=$scope.selectInput.data.Fromdate; 
     $scope.Todate=$scope.selectInput.data.Todate; 
     } 
     $state.go('app.WashType'); 
    } 

Answer 1

私はあなたが問題だと思いますが、あなたのコントローラで（を変形）

HTML

NG-モデル名の不一致です

<div align="center"> 
       Title 
<!-- <input type="text" ng-model="selectInput.Title"> --> 
       <input type="text" ng-model="$scope.selectInput.data.Title"> 
       Offer: 
       <input type="text" ng-model="$scope.selectedInput.data.description"> 
       Valid from: 
<!-- <input type="date" ng-click="FromDate()" ng-model="frDate">--> 
       <input type="date" ng-click="FromDate()" ng-model="$scope.selectInput.data.Fromdate"> 
       <br> Valid till: 
<!-- <input type="date" ng-click="ToDate()" ng-model="toDate" /> --> 
       <input type="date" ng-click="ToDate()" ng-model="$scope.selectInput.data.Todate" /> 
      </div> 
      <hr> 
      <button ng-click='SaveEdit($index)' ng-model="editSave"> Save</button> 

の

JS

$scope.items = []; 
    $rootScope.couponList = [{ Title: "Fruit Export Details" data: {description: "consume soon product", Fromdate: "2016-09-09", Todate: "2016-09-18"}}, 
    {Title: "Vegetables Export Details", data:{description: "consume soon product", Fromldate: "2016-11-09", Todate: "2016-10-19"}}, 
    { CouponTitle: "Saviours",data:{description: "storable", Fromldate: "2016-09-10", Todate: "2016-10-09"}}]; 

    $scope.select_item = function (key) { 
    //alert(key); 
    $scope.items.push(key); 

    } 
    $scope.SaveEdit=function(){ 
      $scope.Title=$scope.selectInput.data.Title; 
     $scope.description=$scope.selectedInput.data.description; 
     $scope.Fromdate=$scope.selectInput.data.Fromdate; 
     $scope.Todate=$scope.selectInput.data.Todate; 
     } 
     $state.go('app.WashType'); 
    } 

Answer 2

あなたNG-モデル値を使用して、コントローラで使用しているものと整列していません。

最初の二つは$スコープとスコープのselectInput財産上のdataプロパティのselectInputプロパティのプロパティを設定しますが、$スコープは、それに割り当てられたオブジェクトselectInputを得るように見えることはありません、それはdataを持つに沿ってみましょうプロパティ。あなたは初期化中に追加する必要がありますあなたのコントローラで

：

$scope.selectInput = {data:null}; 

第三及び第四のフィールドスコープと全く並ばない名前を持っています。

HTML

<div align="center"> 
    Title 
    <input type="text" ng-model="selectInput.data.Title"> 
    Offer: 
    <input type="text" ng-model="selectInput.data.Description"> 
    Valid from: 
    <input type="date" ng-click="FromDate()" ng-model="selectInput.data.FromDate"> 
    <br> 
    Valid till: 
    <input type="date" ng-click="ToDate()" ng-model="selectInput.data.ToDate" /> 
</div> 
<hr> 
<button ng-click='SaveEdit()'> Save</button> 

コントローラ

$scope.items = []; 
$rootScope.couponList = [...items here...]; 

$scope.select_item = function (key) { 
    //alert(key); 
    $scope.items.push(key); 
} 

$scope.SaveEdit = function(){ 
    // Do stuff with 
    // $scope.selectInput.data.Title; 
    // $scope.selectInput.data.Description; 
    // $scope.selectInput.data.FromDate; 
    // $scope.selectInput.data.ToDate; 
}