問題タブ [angular2-databinding]

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 投票する
24 に答える
678230 参照

angular - Angular HTML バインディング

Angular アプリケーションを作成していて、表示したい HTML 応答があります。

それ、どうやったら出来るの?単純にバインディング構文を使用すると、{{myVal}}すべての HTML 文字がエンコードされます (もちろん)。

innerHTMLadivを変数値にバインドする必要があります。

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

angular - テンプレート補間を使用して関数が何度も呼び出されていますか?

基本的な質問で申し訳ありませんが、基本的な例を使用して angular2 フローを理解しようとしています。

この例を実行した後、「デモ テキスト」がコンソールに 4 回表示されます。なぜですか? ありがとう。

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

angular - Angular2 の innerHtml バインディングがデータ バインディングを壊す

データ バインディングを維持しながら、innerHtml にバインドしようとしています。これは機能しません (出力 {{myVar}})。

私の実際のアプリでは、myHtml は SVG ファイルのコンテンツであり (これが必要な理由ですbypassSecurityTrustHtml)、頻繁に変更されるため、テンプレートに配置できません (20 の異なる SVG ファイルから取得される可能性があります)。

コンポーネントの templateUrl を動的に設定する方法があれば、それも私の問題を解決しますが、かなり長い間検索した後では不可能のようです。

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

angular - Angular 2 で `[defaultColor]="'violet'"` を書くことの利点/欠点は何ですか?

angular.io Docs Advancedでは、次のコードを読むことができます。

定数値にバインドする場合は、

私が間違っている?なぜ定数値に動的にバインドするのでしょうか?

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

angular - angular 2のネストされたオブジェクトをサービスからng2-smartテーブルにバインドします

私はAngular 2を初めて使用します。サービスから駆動される選択メニューを含むページがあります。アイテムを選択すると、フルオブジェクトが取得されます。このオブジェクトには、この子をng2-smartテーブルにバインドする必要がある子オブジェクトが含まれています。私はこれをします

これは私のtype.htmlです

これは私のtype.component.tsです

のような選択されたオブジェクト構造

オブジェクト構造

テーブルにバインドするには、Object オブジェクトの型リストを取得する必要があります。

前もって感謝します!

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

angularjs - Angular2: ネストされたデータに適切にバインドするにはどうすればよいですか?

複数選択問題をロードするためのシェルとして使用するコンポーネントがあります。これまでのコンポーネントのセットアップ方法は次のとおりです

成分

HTML テンプレート

現在このように設定されている理由は、最初にやろうとしていた方法が機能しなかったためです。Tour of Heroes チュートリアルに行って、すべてのヒーローをロードする方法をたどりました。問題は、答えが定義されていないことに起因していました。だから私は、物事がどのようにロードされるかのメカニズムを確実に理解するために、私が従うことができる何かをするために、彼らがヒーローと同じようにその部分を装備しました.

私がやろうとした元の方法はこれでした

私はhtmlでそれを呼び出していました

{{expq.question}}、{{expq.name}}、{{expq.answers.id}}、{{expq.answers.answer}}など。

最初は質問をロードするだけでうまくいきましたが、そのanswers:部分に到達すると壊れ始めました。私はこのhttps://scotch.io/tutorials/using-angular-2s-model-driven-forms-with-formgroup-and-formcontrolに出くわし、その部分の構文がaddresses:必要な方法とほとんど同じであることを確認しました私のデータを構造化します。だから私はそれに似るようにすべてを作り直しました。私はまだそれを機能させることができませんでした。

@input最終的には、親コンポーネントを介して質問を送信する@outputだけでなく、私が見つけた他のいくつかのトリックも使用します。しかし、それについて考える前に、ネストされたデータのビットを適切に読み取るために、すべてのデータを 1 つのソースに配置する方法を理解する必要があります。私が遭遇するすべての例は、単純な単一層のデータであるため、使用する必要がある構文についてはわかりません。どうすればこれを機能させることができますか?

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

angular - 親コンポーネントから子コンポーネントにデータを渡す方法は?

子コンポーネントにこのプロパティがあります:

親コンポーネントのテンプレートで、補間を使用してプロパティ バインディングを介して設定します。

子コンポーネント テンプレートは、その submitButtonDisabledプロパティを次のように読み取ります。

タイプスクリプトコードをデバッグすると、プロパティバインディングが正常に機能していることがわかりますが、何disableSubmitButtonが返されても送信ボタンは無効のままです(ブール値)。バインディングが行われる前にコンポーネントがレンダリングされているようです。

これは意味がありますか?私の間違いはどこですか?

リファレンス: Angular 2 - コンポーネント通信