コントローラの配列に値をプッシュ

ng-modelを使用してキャプチャしているDOMに入力フィールドがあります。私のコントローラでコントローラの配列に値をプッシュ

、私は配列があります。私の見解では

app.controller('mainCtrl', function() { 
    // set an empty array 
    self.manualEntry = []; 

    /** 
    * ensure form validation 
    * @returns boolean - ng-disabled value 
    */ 
    self.disableForm = function() { 
     if (self.manualEntry.length <= 0) { 
      return true; 
     } 
     else { 
      return false; 
     } 
    }; 
});

を、私は、入力フィールドがあります。

<form> 
    <input placeholder="John" ng-model="mainCtrl.manualEntry.firstName"/> 
    <input placeholder="Smith" ng-model="mainCtrl.manualEntry.lastName"/> 
</form> 

<button type="submit" 
     ng-disabled="mainCtrl.disableForm()" 
     title="Submit">Submit 
</button>

を私は$scopeが自動的に使用するためにモデルを更新することを考えましたコントローラ。 DOM内でdot notationを使用すると、これらの値が配列に格納されると考えられました。

これらの値を更新すると、フォームのsubmitボタンは無効のままです（disableForm（）はtrueを返します）。

DOMで変更または更新された場合、これらの値をself.manualEntryにプッシュするにはどうすればよいですか？

出典

2016-10-19 Kyle.Belanger

まず、コントローラの名前はNG-モデルタグに表示されません。ですから、それは：ng-model = "manualEntry.firstName"でなければなりません。あなたのng-disabledで同じです。そして、なぜ "$ scope.manualEntry"をそれほど使わないのですか？ manualEntry.firstNameとmanualEntry.lastNameは、$ scope.manualEntry {firstName： ''、lastName： ''}のようなオブジェクトを持っていることを意味します。 –

なぜオブジェクトの代わりに配列を使用していますか？ –

@ M.Be OPはスコープの代わりにコントローラを使用しています。完全に有効で、推奨オプションです。 –

私はあなたが望むものについて大きな前提を設定していますが、通常のフォーム検証がこれを行う方法です。デモ：http://plnkr.co/edit/Nzmk3R8eU0fmbBZRrTBa?p=info

コントローラコード

VARアプリ= angular.module（ 'plunker'、[]）。

app.controller('MainCtrl', function($scope) { 
    // set an empty array 
    var self = this; 
    self.manualEntry = {}; 

    //Let HTML5 handle the form validation itself 
    self.printInfo = function() { 
    console.log(self.manualEntry); 
    }; 
});

HTMLコード：

<body ng-controller="MainCtrl as mainCtrl"> 
    <form ng-submit="mainCtrl.printInfo()"> 
    <input placeholder="John" ng-model="mainCtrl.manualEntry.firstName" ng-required="true" /> 
    <input placeholder="Smith" ng-model="mainCtrl.manualEntry.lastName" ng-required="true" /> 

    <button type="submit" title="Submit">Submit 
    </button> 
    </form> 
</body>

出典

2016-10-19 14:06:26 Ronald91

コントローラの配列に値をプッシュ

答えて

関連する問題