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

GoogleのウェブフレームワークであるAngular(AngularJSと混同しないでください)に関する質問。このタグは、個々のバージョンに固有ではないAngularの質問に使用します。古いAngularJS(1.x)Webフレームワークの場合は、angularjsタグを使用します。

11
「router-outlet」は既知の要素ではありません
角度のあるフロントエンドを備えたmvc5プロジェクトがあります。このチュートリアルhttps://angular.io/guide/routerで説明されているように、ルーティングを追加したいと思いました。だから私の中_Layout.cshtmlに追加しました <base href="/"> app.moduleでルーティングを作成しました。しかし、これを実行すると、次のエラーが発生します。 Error: Template parse errors: 'router-outlet' is not a known element: 1. If 'router-outlet' is an Angular component, then verify that it is part of this module. 2. If 'router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. …

6
:: ng-deepの代わりに使用するもの
ルーターのコンセントによって配置された要素を角度でスタイリングしようとしていますが、生成された要素の幅が100%になるようにします ほとんどの返信から、::ng-deepセレクターを使用する必要があることがわかりましたが、Angularのドキュメントからは非推奨になっています。に代わるものはあり::ng-deepますか?
98 html  css  angular 

14
AngularMaterialアイコンが機能しない
角度のあるマテリアルをインストールしました。 アプリモジュールMatIconModuleにインポートしました(とimport { MatIconModule } from '@angular/material/icon';) ngmoduleのインポートの下に次のように追加しました。 @NgModule({ imports: [ //... MatIconModule, //... すべてのスタイルシートをインポートしました また、実際に(使用しようとしている)アプリコンポーネントにインポートしました(import {MatIconModule} from '@angular/material/icon';先頭に別の行があります)。 ただし、マテリアルアイコンはまだ表示されません。 たとえば、次の行を使用します。 <button mat-icon-button (click)="snav.toggle()"><mat-icon>menu</mat-icon></button> 私はこのようなものを期待しています: しかし、私はこれを取得します: 何か提案がありますか?

4
2つのパラメーターをAngularのEventEmitterに渡すにはどうすればよいですか?
コンポーネントEventEmitterにがありますが、エラーがスローされるため、コンパイルできません。 提供されたパラメータがコールターゲットのシグネチャと一致しません 私のコンポーネント: @Output() addModel = new EventEmitter<any>(); saveModel($event, make, name) { this.addModel.emit(make, name); } その中のパラメータの1つを削除this.addModel.emit()するEventEmitterと機能しますが、2つのパラメータをに渡すことは可能ですか?

4
キャッチされないエラー:予期しないモジュール 'FormsModule'がモジュール 'AppModule'によって宣言されました。@ Pipe / @ Directive / @ Componentアノテーションを追加してください
Angularは初めてです。私はそれを学ぶために英雄ツアーを始めました。だから、私はバインディングapp.component付きで作成されていtwo-wayます。 import { Component } from '@angular/core'; export class Hero { id: number; name: string; } @Component({ selector: 'app-root', template: ` <h1>{{title}}</h1> <h2>{{hero.name}} details!</h2> <div><label>id: </label>{{hero.id}}</div> <div><label>Name: </label> <input [(ngModel)]="hero.name" placeholder="Name"> </div> `, styleUrls: ['./app.component.css'] }) export class AppComponent { title = 'Tour of Heroes'; hero: Hero = { id: …
97 angular 

2
選択タグのngModelへの変更を検出(Angular 2)
私は上の変化を検出しようとしていますngModelで<select>タグ。Angular 1.xでは、$watchon ngModelを使用して、またはを使用してこれを解決するngChange場合がありますがngModel、Angular 2での変更を検出する方法はまだわかりません。 完全な例:http : //plnkr.co/edit/9c9oKH1tjDDb67zdKmr9?p=info import {Component, View, Input, } from 'angular2/core'; import {FORM_DIRECTIVES} from 'angular2/common'; @Component({ selector: 'my-dropdown' }) @View({ directives: [FORM_DIRECTIVES], template: ` <select [ngModel]="selection" (ngModelChange)="onChange($event, selection)" > <option *ngFor="#option of options">{{option}}</option> </select> {{selection}} ` }) export class MyDropdown { @Input() options; selection = 'Dog'; ngOnInit() …

17
OrderByパイプの問題
このコードをAngualr 1からAngular 2に変換できません。 ng-repeat="todo in todos | orderBy: 'completed'" これは私がティエリーテンプリエの答えに従って行ったことです: コンポーネントテンプレート: *ngFor="#todo of todos | sort" コンポーネントコード: @Component({ selector: 'my-app', templateUrl: "./app/todo-list.component.html", providers: [TodoService], pipes: [ TodosSortPipe ] }) パイプコード: import { Pipe } from "angular2/core"; import {Todo} from './todo'; @Pipe({ name: "sort" }) export class TodosSortPipe { transform(array: Array<Todo>, …

2
Angular2はボディタグにクラスを追加します
ボディをアプリセレクターにしてホストバインディングを使用せずに、ボディタグにクラスを追加するにはどうすればよいですか? レンダラーを使ってみましたが、全身が変わります bodyタグのAngular 2.xバインドクラス 私は大きなangular2アプリで作業していて、ルートセレクターを変更すると多くのコードに影響し、多くのコードを変更する必要があります 私のユースケースはこれです: 動的に作成されたモーダルコンポーネントを開くと、ドキュメントのスクロールバーを非表示にしたい
97 angular 

7
継承と依存性注入
私はすべてのいくつかのサービスが注入されるはずのangular2コンポーネントのセットを持っています。私が最初に思ったのは、スーパークラスを作成し、そこにサービスを注入するのが最善だと思いました。次に、私のコンポーネントのいずれかがそのスーパークラスを拡張しますが、このアプローチは機能しません。 簡略化した例: export class AbstractComponent { constructor(private myservice: MyService) { // Inject the service I need for all components } } export MyComponent extends AbstractComponent { constructor(private anotherService: AnotherService) { super(); // This gives an error as super constructor needs an argument } } これを解決するにはMyService、すべてのコンポーネント内に注入し、その引数をsuper()呼び出しに使用しますが、これは明らかに不合理なことです。 スーパークラスからサービスを継承するようにコンポーネントを正しく整理するにはどうすればよいですか?

5
formControlNameとFormControlの違いは何ですか?
私が使用しているReactiveFormsModuleフォームが含まれているコンポーネントを作成するAngular2の。これが私のコードです: foo.component.ts: constructor(fb: FormBuilder) { this.myForm = fb.group({ 'fullname': ['', Validators.required], 'gender': [] }); } foo.component.html(と[formControl]): <div class="fields"> <div class="field"> <label>Fullname*</label> <input type="text" [formControl]="myForm.controls.fullname"/> </div> </div> <div class="inline fields"> <label for="gender">Gender</label> <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="gender" checked="" tabindex="0" class="hidden" [formControl]="myForm.controls.gender"> <label>Male</label> </div> </div> <div class="field"> <div …

17
反応フォーム-無効化された属性
のdisabled属性を使用しようとしていますformControl。私がそれをテンプレートに入れると、うまくいきます: <md-input formControlName="id" placeholder="ID" [disabled]="true"></md-input> しかし、ブラウザは私に警告します: 無効属性を反応フォームディレクティブで使用しているようです。コンポーネントクラスでこのコントロールを設定するときにdisabledをtrueに設定すると、disabled属性が実際にDOMに設定されます。この方法を使用して、「チェック後に変更」エラーを回避することをお勧めします。 Example: form = new FormGroup({ first: new FormControl({value: 'Nancy', disabled: true}, Validators.required), last: new FormControl('Drew', Validators.required) }); だから私はそれを FormControl、テンプレートから削除しました: constructor(private itemsService: ItemsService) { this._items = []; this.myForm = new FormGroup({ id: new FormControl({value: '', disabled: true}, Validators.required), title: new FormControl(), description: new FormControl() …

7
プロパティ 'X'はプライベートであり、クラス 'xyzComponent'内でのみアクセスできます
私はこのブログをフォローしているため、本番用のangular2アプリケーションを構築しようとしています。ngcのコンパイルが成功した後、tsc コンパイルが行われると、次の画像に示すエラーが生成されます。 しばらく検索したところ、「コンテキストプロパティ」セクションの問題を説明しているこのブログを見つけましたが、正しく理解できなかったため、何がおかしいのかよくわかります。基本的に、変数をプライベートにすると、「エラー:プロパティはプライベートであり、クラス内でのみアクセス可能」になります。なぜそれが来るのか理解できません。 過去数日間この問題に頭を悩ませているので、親切に助けてください。


4
ngFor内の動的テンプレート参照変数(Angular 9)
要素内で動的 テンプレート参照変数を宣言するにはどうすればよいngForですか? ng-bootstrapのポップオーバーコンポーネントを使用したいのですが、ポップオーバーコード(Htmlバインディングを使用)は次のようになります。 <ng-template #popContent>Hello, <b>{{name}}</b>!</ng-template> <button type="button" class="btn btn-secondary" [ngbPopover]="popContent" popoverTitle="Fancy content"> I've got markup and bindings in my popover! </button> これらの要素を内部にラップするにはどうすればよいngForですか? <div *ngFor="let member of members"> <!-- how to declare the '????' --> <ng-template #????>Hello, <b>{{member.name}}</b>!</ng-template> <button type="button" class="btn btn-secondary" [ngbPopover]="????" popoverTitle="Fancy content"> I've got markup and bindings …

10
内部にObservableサブスクリプションがある関数から値を返す方法は?
Observableが存在する関数から返される値をObservableから抽出する方法がわかりません。返される値だけが必要です。それ以外は必要ありません。 動作する現在のバージョン function getValueFromObservable() { this.store.subscribe( (data:any) => { console.log(data) } ) } getValueFromObservable() これが機能し、値を返す関数が必要です: function getValueFromObservable() { this.store.subscribe( (data:any) => { return data } ) } console.log(getValueFromObservable()) ここで何が悪いのですか?

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.