[解決済み】Angularのコールバック関数をAngularJSのように@Inputで子コンポーネントに渡す。
2022-04-01 09:40:07
質問
AngularJSには&パラメータがあり、ディレクティブにコールバックを渡すことができます(例えば
AngularJSのコールバックの方法
. としてコールバックを渡すことは可能ですか?
@Input
Angular Componentのために(以下のようなもの)?もしそうでなければ、AngularJSが行うことに最も近いものは何でしょうか?
@Component({
selector: 'suggestion-menu',
providers: [SuggestService],
template: `
<div (mousedown)="suggestionWasClicked(suggestion)">
</div>`,
changeDetection: ChangeDetectionStrategy.Default
})
export class SuggestionMenuComponent {
@Input() callback: Function;
suggestionWasClicked(clickedEntry: SomeModel): void {
this.callback(clickedEntry, this.query);
}
}
<suggestion-menu callback="insertSuggestion">
</suggestion-menu>
解決方法は?
それは悪い解決策だと思います。もし、Functionをコンポーネントに渡すときに
@Input()
,
@Output()
デコレーターがあります。
export class SuggestionMenuComponent {
@Output() onSuggest: EventEmitter<any> = new EventEmitter();
suggestionWasClicked(clickedEntry: SomeModel): void {
this.onSuggest.emit([clickedEntry, this.query]);
}
}
<suggestion-menu (onSuggest)="insertSuggestion($event[0],$event[1])">
</suggestion-menu>
関連
-
[解決済み】npm UNMET PEER DEPENDENCYの警告を修正するにはどうすればいいですか?
-
[解決済み】Angularjsのng-viewが動作しない。
-
[解決済み】Angular ui-routerで$stateメソッドを$stateChangeStart toStateとfromStateで使用する。
-
[解決済み] X-Frame-Options'を'SAMEORIGIN'に設定しているため、フレーム内での表示を拒否された。
-
[解決済み] AngularJSのシンプルな "Hello, world "が動作しない。
-
[解決済み] Angular 1.2+ で ng-bind-html-unsafe を複製するために $sce.trustAsHtml(string) を使用するにはどうしたらよいですか?
-
[解決済み] AngularJSでkeypressイベントを使用するには?
-
[解決済み] ng-repeat内のng-click関数にパラメータを追加しても、うまくいかないようです。
-
[解決済み] Angularのルーティングされたコンポーネントにデータを渡すにはどうしたらいいですか?
-
[解決済み】親クラスから子コンポーネントのメソッドを呼び出す - Angular
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】typeerrorは、未定義のプロパティ'data'を読み取ることができません。
-
[解決済み] X-Frame-Options'を'SAMEORIGIN'に設定しているため、フレーム内での表示を拒否された。
-
[解決済み] AngularJs ReferenceError: $http is not defined
-
[解決済み] AngularJSのグローバル変数
-
[解決済み] AngularJSの.$uibModalとは何ですか?
-
[解決済み] エラーです。[$injector:unpr] 不明なプロバイダです。ルートプロバイダ
-
[解決済み] md-selectでデフォルト値を設定する方法
-
[解決済み] AngularJSの.$on()とは?
-
[解決済み] 入力フィールドにフォーカスを当てるには?
-
[解決済み] ng-classを使った複数クラスの追加