問題タブ [angular2-ngmodel]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
4 に答える
36452 参照

angular - Angular2 ngModelChange 以前の値

ngModelChange のフィールドの前の (最後の) 値を取得する方法はありますか? 私が持っているものはこのようなものになります

HTML

ハンドラ

私が得るものは

もちろん、別の変数を使用して古い値を保持することもできますが、もっと良い方法はありますか?

0 投票する
1 に答える
2548 参照

angular - 初期化中にネストされたngModelコンポーネントの値を更新する方法は?

ネストされたコンポーネント内でデフォルト値を初期化しようとしていますが、ネイティブ HTML 要素が更新されません。

私はすでにコンストラクターngOnInitを試しました。AfterViewInitAfterViewCheckedは、変更検出後に値操作があるというエラーをスローします。

ルート テンプレート:

子テンプレート:

子コンポーネント:

細かいところを見逃していたと思います。

http://plnkr.co/edit/F9pfUQ50YPV5UPiH0kw7

0 投票する
1 に答える
20316 参照

angular - Angular 2: ngModel でパイプを使用する

フォームの 1 つで JQuery 入力マスクを とともに使用して[(ngModel)]いましたが、何らかの理由でそれらが連携しません。いずれかを単独で使用しても問題なく動作しますが、2 つを組み合わせると完全に機能[(ngModel)]しなくなり、新しい入力がコンポーネントに送り返されません。しばらくこれに苦労した後、Angular 2のパイプを使用するのが良い解決策になると考えましたが、これら2つを連携させる方法もわかりません。

パイプをテストするために使用しているコードを次に示します

12345 と入力すると、下の<p>タグに 12,345.00 が表示されます。これはまさに私がフィルター処理したい方法ですが、フィルター処理された金額を入力の下に表示したくないので、入力自体に 12,345.00 を表示させたいのです。同じパイプをngModellike this:に追加すると[(ngModel)]="Amount | number:'1.2-2'"、次のエラーが表示されます。

パーサー エラー: [Amount | 10 列目のアクション式にパイプを含めることはできません。number:'1.2-2'=$イベント]

入力内でパイプ (または入力マスク) を使用するにはどうすればよい[(ngModel)]ですか?

0 投票する
4 に答える
3425 参照

angular - Angular 2: JQuery UI Datepicker が ngModel を変更しない

angular 2アプリケーションでJQuery UIのdatepickerが機能していますが、ngModel. という変数がありSeasonStartDate、ユーザーが入力した日付に更新したいと考えています。たとえば、10 月 31 日など、日付ピッカーで日付を選択すると、予想どおり 2016 年 10 月 31 日と入力されますが、ngModel正常に更新されません。

ここに私の入力があります:

Date: {{SeasonStartDate}}値が更新されているかどうかをテストできるように、入力の下に追加しました。

値を更新する私のコンポーネントのコードは次のとおりです。

クラス(日付ピッカーを開始するために必要)を削除date-pickerし、入力を手動で入力するだけでSeasonStartDate期待どおりに更新されるため、残りのコードが機能することがわかります。ngModelと JQuery UI Datepicker を連携させるにはどうすればよいですか? これは可能ですか?特にAngular 2専用の日付ピッカーが他にもあることは知っていますが、可能であればJQueryのバージョンを好みます。

0 投票する
2 に答える
2713 参照

angularjs - Angular2 ngModel 形式。基礎となるモデルの更新を防止する

そのように定義されたコンポーネントにこれらのプロパティがあります。

次に、次のように設定された currentDefinition に従ってデータを表示するフォームがあります。

フォーム入力フィールドは ngModel を次のように使用します。

これは、入力フィールドの 1 つを編集するとすぐに、基になる currentDefinition と userDataDefinitions が期待どおりに即座に更新されることを意味します。私の質問は、基になるモデルをアクション (フォームの送信など) でのみ更新したい場合はどうすればよいですか? currentDefinition を複製する必要がありますか? ngModel を使用すべきではありませんか?

この結果を達成するための正しい angular2 の方法は何ですか?

どうもありがとうございました

よろしく

0 投票する
0 に答える
352 参照

angular - Angular2 - 配列の各インデックスに対する双方向データバインディング

私のプロジェクトでは、製品に複数の価格表を含めることができます。各価格表には、その特定の製品の異なる価格を含めることができます。製品を編集するとき、価格表に従ってその製品のすべての価格を取得したいと考えています。必要なデータを正常にフェッチして表示し、(一種の) 2 ウェイでテンプレートにバインドすることもできます。2 つの異なる方法でバインドしようとしましたが、まだ正しくバインドできません。配列の最後のインデックスにのみバインドしているようです。入力欄に正しい値を表示したい。ユーザーが価格を更新すると、更新できるようになります。テーブルに表示されているのと同じデータを入力フィールドに表示してバインドしたいのですが、画像とコードを見ていただくとより理解が深まります。

画像 ここに画像の説明を入力

コード

AddProductComponent

HTML