タグ付けされた質問 「angular」

ユーザーがドロップダウン以外の場所をクリックしたときにログインメニューのドロップダウンを閉じたいのですが、Angular2とAngular2の "アプローチ"でそれを実行したいのですが... ソリューションを実装しましたが、自信がありません。同じ結果を達成する最も簡単な方法がなければならないと私は思います、あなたが何かアイデアがあれば...議論しましょう:)！ これが私の実装です： ドロップダウンコンポーネント： これは私のドロップダウンのコンポーネントです： このコンポーネントが可視に設定されるたびに（たとえば、ユーザーがボタンをクリックしてそれを表示すると）、SubjectsService内に格納された「グローバル」なrxjsサブジェクトuserMenuにサブスクライブします。 そして、それが非表示になるたびに、この件名の購読を解除します。 このコンポーネントのテンプレート内の任意の場所をクリックするたびに、onClick（）メソッドがトリガーされます。これにより、上部（およびアプリケーションコンポーネント）へのイベントバブリングが停止します。 これがコードです export class UserMenuComponent { _isVisible: boolean = false; _subscriptions: Subscription<any> = null; constructor(public subjects: SubjectsService) { } onClick(event) { event.stopPropagation(); } set isVisible(v) { if( v ){ setTimeout( () => { this._subscriptions = this.subjects.userMenu.subscribe((e) => { this.isVisible = false; }) …

144 javascript  drop-down-menu  angular  rxjs 

私はangular2このアドレスでチュートリアルを行っています：https : //angular.io/docs/ts/latest/tutorial/toh-pt3.htmlheroインターフェースをappフォルダーの下の単一のファイルに入れました。コンソールで、このエラーが発生しました： app/app.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module. [0] app/hero-detail.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module. インターフェイスファイルをヒーローフォルダーに配置すると、エラーが消えます。これはドキュメントに記載されていません。インポートの何が問題になっていますか？ （コンポーネントファイルのbeguiningで）私のimportディレクティブの両方でapp.components.tsとhero-detail.component.ts： import {Component} from 'angular2/core'; import {Hero} from './hero'; インポートディレクティブを次のように置き換える必要import {Hero} from './'; があります：または単にコードをヒーローフォルダーに配置しますか？

144 angular 

エラーが出ました node_modules / rxjs / internal / types.d.ts（81,44）：エラーTS1005： ';' 期待された。 Angular 6のインストール後。 エラーを確認します。 ERROR in node_modules/rxjs/internal/types.d.ts(81,44): error TS1005: ';' expected. node_modules/rxjs/internal/types.d.ts(81,74): error TS1005: ';' expected. node_modules/rxjs/internal/types.d.ts(81,77): error TS1109: Expression expected.

143 angular  typescript  build  installation  rxjs 

私はAngular 2をいじくり始めたばかりで、イベントリスナーを要素に動的に追加および削除する最良の方法を誰かが教えてくれるかどうか疑問に思っています。 コンポーネントをセットアップしました。テンプレート内の特定の要素をクリックしたときmousemoveに、同じテンプレートの別の要素にリスナーを追加したいと思います。次に、3番目の要素がクリックされたときにこのリスナーを削除します。 単純なJavascriptを使用して要素を取得し、標準を呼び出すだけでこれが機能するようになりaddEventListener()ましたが、これを行うには、 " Angular2.0 "の方法がもっとあるのではないかと思いました。

143 angular  typescript  addeventlistener 

HTML INPUTフィールドがあります。 <input [(ngModel)]="item.value" name="inputField" type="text" /> そして、その値をフォーマットして既存のパイプを使用したいと思います： .... [(ngModel)]="item.value | useMyPipeToFormatThatValue" .... そしてエラーメッセージを取得します： アクション式にパイプを含めることはできません このコンテキストでパイプを使用するにはどうすればよいですか？

143 angular  pipe  html-input  angular2-ngmodel 

Angular-CLI（ベータ20）でビルドされたAngular2プロジェクトがあります。 選択した1つのスペックファイルのみに対してテストを実行する方法はありますか？ 以前はAngular2クイックスタートに基づくプロジェクトを使用しており、jasmineファイルに手動でスペックを追加できました。しかし、カルマテスト以外でこれを設定する方法や、Angular-CLIビルドでカルマテストを特定のファイルに制限する方法がわかりません。

143 angular  jasmine  angular-cli 

変数がprivateコンポーネントクラスで宣言されている場合、そのコンポーネントのテンプレートで変数にアクセスできますか？ @Component({ selector: 'my-app', template: ` <div> <h2>{{title}}</h2> <h2>Hello {{userName}}</h2> // I am getting this name </div> `, }) export class App { public title = 'Angular 2'; private userName = "Test Name"; //declared as private }

143 typescript  angular  angular2-template 

コンポーネントがレンダリングされる前に、APIからイベントをロードしようとしています。現在、コンポーネントのngOnInit関数から呼び出すAPIサービスを使用しています。 私のEventRegisterコンポーネント： import {Component, OnInit, ElementRef} from "angular2/core"; import {ApiService} from "../../services/api.service"; import {EventModel} from '../../models/EventModel'; import {Router, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig, RouteParams, RouterLink} from 'angular2/router'; import {FORM_PROVIDERS, FORM_DIRECTIVES, Control} from 'angular2/common'; @Component({ selector: "register", templateUrl: "/events/register" // provider array is added in parent component }) export class EventRegister implements OnInit …

143 typescript  angular  angular2-services  angular2-http 

ブートストラップ時に注入するとすべての子が同じインスタンスを共有するはずであると読みましたが、メインコンポーネントとヘッダーコンポーネント（メインアプリにはヘッダーコンポーネントとルーターアウトレットが含まれています）はそれぞれサービスの個別のインスタンスを取得しています。 私はFacebookのJavaScript APIを呼び出すために使用するFacebookServiceと、FacebookServiceを使用するUserServiceを持っています。これが私のブートストラップです： bootstrap(MainAppComponent, [ROUTER_PROVIDERS, UserService, FacebookService]); ログから、ブートストラップ呼び出しが終了したように見えます。その後、各コンストラクター、MainAppComponent、HeaderComponent、およびDefaultComponentのコードが実行される前に、FacebookServiceが作成され、次にUserServiceが作成されます。

142 angular  typescript  angular2-routing  angular2-services 

Angular CLIを使用してAngular 2アプリを作成するときのようです。私のデフォルトのコンポーネント接頭辞はAppComponentのapp-rootです。ここで、セレクターを別のものに変更すると、「abc-root」と言います @Component({ selector: 'abc-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) vscodeは私に警告します、 [tslint] The selector of the component "AppComponent" should have prefix "app"

142 angular 

私はhashlocation戦略でangular 2を使用しています。 コンポーネントはそのルートで読み込まれます： "departments/:id/employees" これまでのところ結構です。 編集した複数のテーブル行をバッチ保存した後、次の方法で現在のルートURLを再ロードします。 this.router.navigate([`departments/${this.id}/employees`]); しかし、何も起こりません、なぜですか？

141 angular 

Angular CLIでAngle 2 Appを作成したい 私はcmdに書いています： npm install angular-cli -g 次に： ng firstngapp npm startと書くとエラーが表示されます！ 問題がわかりません

140 angular  npm  angular-cli 

Angular 1.xでは、基本的に何もしないリンクを作成するために次のことができます。 <a href="">My Link</a> しかし、同じタグがAngular 2のアプリベースに移動します。Angular2のそれに相当するものは何ですか？ 編集： Angular 2ルーターのバグのようですが、githubに未解決の問題があります。 すぐに使えるソリューション、またはそれがないことの確認を探しています。

140 angular  routing  angular2-routing  angular-router 

私が投稿リクエストをすると、angular 2 httpがこのリクエストを送信していません this.http.post(this.adminUsersControllerRoute, JSON.stringify(user), this.getRequestOptions()) http投稿はサーバーに送信されませんが、このようなリクエストを行うと this.http.post(this.adminUsersControllerRoute, JSON.stringify(user), this.getRequestOptions()).subscribe(r=>{}); これは意図されていますか？それが可能であれば、誰かが私に理由を説明できますか？それともバグですか？

140 angular  angular2-http 

私は最近退職した他の開発者からいくつかのめちゃくちゃなコードを取得するよう割り当てられています。 不思議なことに、インポートと参照を迅速かつ効果的に整理して整理するのに役立つVisual Studio Codeまたはその他の手段のプラグインはありますか？ たとえば、このようなインポートはおそらく数百あります import { AutoCompleteModule,InputSwitchModule } from 'primeng/primeng'; import { ListboxModule } from 'primeng/primeng'; 同様に変換することができます import { AutoCompleteModule, InputSwitchModule, ListboxModule } from 'primeng/primeng'; または、app.moduleまたはプロジェクト全体のすべてのコンポーネントから未使用のインポートと宣言を自動的に削除するような他の関数？ フィードバックをありがとう！

139 angular  visual-studio-code