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

私の問題は非常に古典的です。の背後にあるアプリケーションのプライベート部分がありますlogin form。ログインが成功すると、管理アプリケーションの子ルートに移動します。 私の問題はglobal navigation menu、ルーターが私のAdminComponent代わりに私のでルーティングしようとするため、を使用できないことAppCompomentです。だから私のナビゲーションは壊れています。 もう1つの問題は、誰かがURLに直接アクセスしたい場合、親の「ログイン」ルートにリダイレクトしたいということです。しかし、私はそれを機能させることはできません。これらの2つの問題は似ているように私には思えます。 それをどのように行うことができるか考えていますか？

94 angular  angular-routing  angular-router 

この例の最初のオカレンスをデフォルトとして設定しようとしています：plunkr 次のエラーが発生します。 Unhandled Promise rejection: Template parse errors: TypeError: Cannot read property 'toUpperCase' of undefined ("dButtonToggleGroup"> <md-button-toggle [ERROR ->]*ngFor="let indicador of indicadores; #first = first" value="indicador.id" [checked]="first">"): ng:///AppModule/HomeComponent.html@35:78 Parser Error: Unexpected token #, expected identifier, keyword, or string at column 31 in [let indicador of indicadores; #first = first] in …

94 angular  angular-material 

Angular 2.0コンポーネントを作成するとき、プロパティのデフォルト値をどのように設定しますか？ たとえば、デフォルトでに設定fooしたいの'bar'ですが、バインディングがすぐにに解決される場合があります'baz'。これはライフサイクルフックでどのように機能しますか？ @Component({ selector: 'foo-component' }) export class FooComponent { @Input() foo: string = 'bar'; @Input() zalgo: string; ngOnChanges(changes){ console.log(this.foo); console.log(changes.foo ? changes.foo.previousValue : undefined); console.log(changes.foo ? changes.foo.currentValue : undefined); } } 以下のテンプレートを考えると、これが私が期待する値です。私が間違っている？ <foo-component [foo] = 'baz'></foo-component> コンソールに記録： 'baz' 'bar' 'baz' <foo-component [zalgo] = 'released'></foo-component> コンソールに記録： 'bar' undefined undefined

93 angular  typescript 

オブジェクトの編集に使用されるコンポーネントの単体テストを行っています。オブジェクトには、idサービスでホストされているオブジェクトの配列から特定のオブジェクトを取得するために使用される一意のオブジェクトがあります。特定のものidは、ルーティングを介して、特にActivatedRouteクラスを介して渡されるパラメーターを介して調達されます。 コンストラクターは次のとおりです。 constructor(private _router:Router, private _curRoute:ActivatedRoute, private _session:Session) { } ngOnInit() { this._curRoute.params.subscribe(params => { this.userId = params['id']; this.userObj = this._session.allUsers.filter(user => user.id.toString() === this.userId.toString())[0]; このコンポーネントで基本的な単体テストを実行したいと思います。ただし、idパラメータを挿入する方法がわからないため、コンポーネントにはこのパラメータが必要です。 ちなみに、私はすでにSessionサービスのモックを持っているので、心配はいりません。

93 unit-testing  angular  angular2-routing  angular2-testing 

条件に基づいて、オブザーバブルのマップ演算子からエラーをスローしたい。たとえば、正しいAPIデータが受信されない場合。次のコードを参照してください。 private userAuthenticate( email: string, password: string ) { return this.httpPost(`${this.baseApiUrl}/auth?format=json&provider=login`, {userName: email, password: password}) .map( res => { if ( res.bearerToken ) { return this.saveJwt(res.bearerToken); } else { // THIS DOESN'T THROW ERROR -------------------- return Observable.throw('Valid token not returned'); } }) .catch( err => Observable.throw(this.logError(err) ) .finally( () => …

93 angular  typescript  rxjs 

RC5にアップグレードした後、次のエラーが発生し始めました。 ngModel cannot be used to register form controls with a parent formGroup directive. Try using formGroup's partner directive "formControlName" instead. Example: <div [formGroup]="myGroup"> <input formControlName="firstName"> </div> In your class: this.myGroup = new FormGroup({ firstName: new FormControl() }); Or, if you'd like to avoid registering this form control, indicate that …

93 angular  angular2-forms  angular2-formbuilder 

Angularのドキュメントには--base-href、サーバーのサブフォルダーにデプロイするときに、本番用のAngularアプリケーションビルドでパラメーターを使用する必要があることが記載されています。 ファイルをサーバーサブフォルダーにコピーする場合は、ビルドフラグを追加し --base-href、<base href>適切に設定します。 たとえば、index.htmlがのサーバー上にある場合は/my/app/index.html、ベースhrefを次の<base href="https://stackoverflow.com/my/app/">ように設定します。 https://angular.io/guide/deployment ただし、angular-cliには--deploy-urlパラメーターがあります。ツールのドキュメントでは、次のように説明されています。 ファイルがデプロイされるURL。 https://github.com/angular/angular-cli/wiki/build アプリケーションがサーバーのサブフォルダーにデプロイされるときの--deploy-url意図を使用するソリューションを見てき--base-hrefました。 質問 角度CLIツールのパラメータ--base-hrefとの違いは何--deploy-urlですか？それぞれをいつ使用する必要がありますか？

93 angular  angular-cli 

JSONオブジェクトからのsrcでimgを実装したいと思います。 AngularJSでは、私は次のことができました： <img ng-src="{{hash}}" alt="Description" /> Angular 2+にはこれに相当するものはありますか？

92 angular 

次のステートメントの{read：ViewContainerRef}の意味を理解するための助けが必要です。 @ViewChild('myname', {read: ViewContainerRef}) target;

92 angular 

RESTfulエンドポイントからデータをフェッチするサービスを呼び出すコンポーネントがあります。このサービスには、データをフェッチした後に実行するコールバック関数を指定する必要があります。 問題は、コールバック関数を使用して、コンポーネントの変数の既存のデータにデータを追加しようとすると、を取得することEXCEPTION: TypeError: Cannot read property 'messages' of undefinedです。なぜthis未定義なのですか？ TypeScriptバージョン：バージョン1.8.10 コントローラーコード： import {Component} from '@angular/core' import {ApiService} from '...' @Component({ ... }) export class MainComponent { private messages: Array<any>; constructor(private apiService: ApiService){} getMessages(){ this.apiService.getMessages(gotMessages); } gotMessages(messagesFromApi){ messagesFromApi.forEach((m) => { this.messages.push(m) // EXCEPTION: TypeError: Cannot read property 'messages' of undefined }) …

92 javascript  arrays  typescript  angular 

コンポーネントのformArrayを反復処理しようとしていますが、次のエラーが発生します Error: Cannot find control with unspecified name attribute これが私のクラスファイルのロジックの様子です export class AreasFormComponent implements OnInit { public initialState: any; public areasForm: FormGroup; constructor(private fb: FormBuilder) { } private area(): any { return this.fb.group({ name: ['', [Validators.required]], latLong: ['', [Validators.required]], details: ['', [Validators.required]] }); } public ngOnInit(): void { this.areasForm = …

92 loops  angular  angular2-forms 

コンポーネントがあるとします。 @Component({ selector: 'MyContainer', template: ` <div class="container"> <!-- some html skipped --> <ng-content></ng-content> <span *ngIf="????">Display this if ng-content is empty!</span> <!-- some html skipped --> </div>` }) export class MyContainer { } ここで、<ng-content>このコンポーネントが空の場合、デフォルトのコンテンツを表示したいと思います。DOMに直接アクセスせずにこれを行う簡単な方法はありますか？

92 javascript  angular 

ローカルマシンで角度コードを設定しました。プロジェクトで使用しているアングルのバージョンを知る必要があります。cmdプロンプトで簡単に見つけるにはどうすればよいですか？

92 javascript  angular 

このコードを考えると： this.form = this.formBuilder.group({ email: ['', [Validators.required, EmailValidator.isValid]], hasAcceptedTerms: [false, Validators.pattern('true')] }); からすべての検証エラーを取得するにはどうすればよいthis.formですか？ 単体テストを作成していて、実際の検証エラーをアサートメッセージに含めたいと思います。

92 angular  typescript  validation 

HTMLファイルに次のボタンがある場合 <button (click)="doSomething('testing', $event)">Do something</button> また、対応するコンポーネントには、この機能があります doSomething(testString: string, event){ event.stopPropagation(); console.log(testString + ': I am doing something'); } $event入力に割り当てる必要のある適切なタイプはありますか？イベントパラメータ自体はオブジェクトですが、タイプオブジェクトに割り当てると、エラーが発生します プロパティ 'stopPropogation'はタイプオブジェクトに存在しません では、Typescriptは$event入力を何と見なしますか？

92 javascript  typescript  angular