問題タブ [angular2-directives]
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.
css - Angular 2 + Semantic UI 、コンポーネントのカプセル化がスタイルを破る
セマンティック UI を備えた Angular2 を css ライブラリとして使用しています。私はこのコードを持っています:
カードは、間にスペースを入れてきれいにレンダリングされます。このように:リンクのカードセクションを参照してください
カードはある種のビューを表しているので、そこからコンポーネントを作成することを考えたので、コードは次のようになります。
しかし今はスタイルが壊れており、それらの間にスペースはありません。
これを修正する良い方法はありますか?
私がやろうと思った最初のことはこれです:
オブジェクトを渡せるようにしたいのですが、コンポーネントが自動的に[href]=obj.link
.
AngularJS 1.0 には、replace: true
私が必要としている機能を正確に実行するプロパティがありました。Angular2 にも同様の機能がありますか?
angular - Angular 2:ディレクティブ* ng-forの使用中にエラーが発生しました
Angular 2.0 ベータ版を使い始めたところです。追加中にエラー angular が定義されていませんdirective : [angular.ngFor]
。
Plunker URL の追加http://plnkr.co/edit/ULHddLRqPFXvNG7NPo93?p=preview
前もって感謝します
typescript - 親コンポーネントとディレクティブ間のAngular2双方向データバインディング
以下の更新を参照してください
まだ Angular2 Beta で遊んでいますが、「エディター」コンポーネント テンプレートに Ace エディターをラップするディレクティブが含まれるシナリオを実装しようとしています。したがって、「エディター」コンポーネントは Ace ラッパー ディレクティブの親であり、ディレクティブからコードを取得するか、コードを設定したいと考えています。
ディレクティブだけでも問題なく動作しますが、このコンポーネントに含めると何も表示されません。ブラウザのコンソールにエラーは表示されません。このPlunkerで再現を見つけることができます: http://plnkr.co/edit/kzclJLIX6hRMWa14A0Pb。
私の実装ではace.directive
、Ace エディターをラップするディレクティブにtext
プロパティとtextChanged
イベントがあります。
editor.component
コンポーネントはディレクティブを使用します。このディレクティブには、編集xml
中の XML コードを表すプロパティがあります。そのテンプレートには、次のようなディレクティブが含まれています。
つまり、ディレクティブのtext
プロパティは親コンポーネントのプロパティにバインドされxml
、ディレクティブのtextChanged
イベントは親の
onXmlChanged
関数によって処理されます。
これは双方向のデータバインディングです。私の知る限り、次のことも試すことができます。
エディタのコードは次のとおりです。
更新 #1 何らかの理由で、Plunker は既存のファイル以外の .ts ファイルを変換およびロードしないため、ローカルでトラブルシューティングを続けました。
$event
質問に関しては、テンプレートの呼び出しに引数を追加する必要があることがわかりました (私のコメントを参照してください)。私のディレクティブは次のとおりです。
エディター コンポーネント テンプレートには、次のようなディレクティブが含まれています。
とにかく、エディターのコンポーネント プロパティをプログラムで設定しようとすると、Angular が起動し、変更がプロパティを再度xml
設定するイベントを発行する ace エディターでイベントをトリガーするため、エンドレス ループが発生することに注意してください。xml
おそらく私が何か間違ったことをしているだけですが、現在、コードでこのハックを使用する必要があり、もちろん好きではありません:):
angular - テキストが角度で表示されないのはなぜですか?
angular 2でコンポーネントテキストを表示しようとしていますが、表示されません。どこが間違っているのか教えてください。ここに私のコードがあります
angular - あるコンポーネントから別のコンポーネントに値を送信する方法は?
入力フィールドとボタンが 1 つあるコンポーネントを作成します。ボタンをクリックすると、2 番目のコンポーネントが表示されます。あるコンポーネントから別のコンポーネントにデータを送信したいですか?
あるコンポーネントから別のコンポーネントにデータを送信する方法..次のコンポーネントまたは次のページに表示する必要がある入力値 (ユーザーが入力フィールドに入力したもの) を送信する必要があります。ボタンをクリックすると、データを送信する方法は? ここに私のプランカーがあります http://plnkr.co/edit/IINX8Zq8J2LUTIyf4DYD?p=preview
javascript - Angular2 - クライアント側でモジュールが必要
Node.js / Express / Angular2 / typescript (IDE=Visual Studio) アプリのコンテキストで、(ディレクティブで使用するために) サード パーティの .js ユーティリティ (packery) をクライアント側にロードしようとしています。誰かがタイプスクリプト定義を作成しました。d.ts ファイルは次のようになります。
この d.ts ファイルを参照し、ブラウザーに .js パッカリー スクリプトの場所を伝えてから、モジュールを次のようにインポートします。
これは問題なくコンパイルされます。ただし、実行時に、ブラウザはhttp://localhost/packeryで「packery」を見つけようとします (そして失敗します) 。これは、私がクライアントで行った次のような他のインポート ステートメントとは対照的です。
どちらが機能しますか-私が提供した唯一の2つの情報は、packeryと同様に、d.tsファイルと.jsファイルの場所でした. しかし、私は何かが欠けているに違いありません。ファイルの場所とリンクの多くの組み合わせを試しましたが、うまくいきません。「packery」への適切なリンクを取得するにはどうすればよいですか?
ありがとう!