TypeScript - Angular 4でヘッダー付きのHTTPリクエスト

現在、バックエンドからJSONレスポンスを取得しようとしていますが、GETリクエストを実行すると次のエラーが発生します（最初の画像を参照してください）。プリフライトのレスポンスのHTTPステータスコードが無効です: 401

しかし、バックエンドは正常に動作しており、URLとヘッダー（トークン）も正しいと確信しています。なぜなら、Postmanは期待する結果を返すからです（2枚目の画像を参照）。

続きを読む →

TypeScript - Angular 4 の Http JSON のデシリアライズとジェネリクス

私は以下のようなJSONオブジェクトを返すAPIを持っています：

{ "name": "testing", "theme": "something" "themeProperties": {} }

themeProperties が持つオブジェクトのタイプは、theme の値によって変わります。私はこれらのタイプを次のように定義しようとしています:

export class Config<T> { public name: string; public theme: string; public themeProperties: T } export class Style1Props extends Config<Style1Props> { public fooProp1: number; public fooProp2: boolean }

続きを読む →

angular - ページ更新に対応したAngularfire2の役割ベースの認可

私は学校の課題のために、Angularfire2とAngular4を使用してロールベースの認可を構築しようとしています。動作はしていますが、ページをリロードすると、GuardがAngularfireがFirebaseのDBからユーザー（+ロール）を取得する前に実行されるため、ログインページにリダイレクトされます。エンドユーザーがページをリロードしてもログインページにリダイレクトされないようにしたいです。

多くのウェブサイトを調べましたが、有用な情報は見つかりませんでした。多くのサイトはリロード対応の方法を説明していますが、ユーザーロールを使用していません（つまりFirebaseのDBクエリはありません）。一方で、他のサイトは複数のユーザーロールの使用方法を説明していますが、ページリロードには対応していません。

私の（関連する）コード：

auth.service.ts：

import { Injectable } from '@angular/core'; import { Angul

続きを読む →

javascript - Angular 4 - 数量とオプションの変更に基づいて価格を計算する方法

要件 ショッピングカートにはアイテムのリストがあります。各アイテムにはオプション、数量、価格があります。アイテムの数量やオプションの変更に基づいて価格を計算する必要があります。

リサーチ 2方向データバインディングを使うために、以下のように [(ngModel)] を追加しましたが、なぜかページがずっと読み込み中のままで、エラーもなくクラッシュしてしまいます。ngModel 属性を削除すると、ページは正常に読み込みます。

続きを読む →

javascript - Angular 4 - アプリ全体でユーザーのログイン状態を追跡してビューを操作する

私のアプリ内のルートアプリコンポーネントには、アプリのメインメニューが含まれています。現在、ユーザーがログインしているかログアウトしているかに基づいて、メニュー項目を非表示または表示させたいです。

<li class="nav-item" *ngIf="isLoggedIn"> <a class="nav-link" [routerLink]="['/profile']">Profile <span class="sr-only">(current)</span></a> </li>

私はAuthentication Serviceを持っており、それはユーザーのログイン情報をAPIに送信し、APIがユーザーを認証してトークンを返します。そしてそのトークンはlocalStorageに保存されます。

フロントエンドでルートを変更する際にユーザーが認証され

続きを読む →

typescript - IIS を使って Angular 4（2 ではなく）アプリケーションを実行するにはどうすればよいですか

私は IIS 上で簡単な「Hello world」アプリケーションを Angular 4 で実行しようとしましたが、すべての試みは失敗しました（エラーは表示されず、白いページが表示されるだけです！）。実行できたのは次のいずれかの方法の場合だけです。 1- 「ng build」CLI コマンドを使用してアプリケーションをビルドし、その出力ディレクトリをウェブサイトのパスに設定した場合。 2- 「ng serve」コマンドを使用してアプリケーションを実行した場合（これは IIS ではなく Angular サーバーで実行されます）。 要するに、Visual Studio を使用して Angular 4 アプリケーションを書き、Ctrl + F5 を押すだけでアプリケーションを実行したいのです。 注：Angular 2 では問題なく動作しますが、Angular 4 ではうまくいきませんでした。

回答 #1

Angular 2以降、これがAngularを実行する唯一の主要な

続きを読む →

api - Angular 2 | 401 未承認

こんにちは、私はトークンでAPIデータを取得するだけの簡単なアプリを作っていますが、認証されていないアクセスエラーが発生しています...

誰か、このエラーが出る理由を教えてくれませんか？

401 認証されていません

import { Component, ViewEncapsulation } from '@angular/core'; import { Http, Response } from '@angular/http'; import 'rxjs/add/operator/map'; @Component({ selector: 'app-root', templateUrl: '.

続きを読む →

typescript - Angular Aot エラー - エクスポートされた関数への参照で関数を置き換える方法

私はこのコードを持っています

export function LocalStorage(key?: string) { return WebStorage(localStorage, key); } export function WebStorage(webStorage: Storage, key: string) { return (target: Object, propertyName: string): void => {

続きを読む →

Webpack + Typescript + Angularjs - System.Register（Webpack 警告）

私は次の設定を持っています：

• Webpack v3.6.0
• TypeScript v2.5.2
• AngularJS v1.4.8

サービスに定数ファイルをインポートしようとしています:

// const.ts const TEST_CONSTANT = { names: [ 'const1' ] }; default export TEST_CONSTANT; // service.ts import TEST_CONSTANT from 'const'; // tsconfig.json { "compilerOptions": { "module": "commonjs", "moduleResolution": "node", "target": "es5", "noImplicitAny": false, "sourceMap": true }, "include": [ "src/**

続きを読む →

html - Angular 2でオプションをプレースホルダーとして使用するselectフォームのバリデーションを設定する方法

category.component.ts

export class CategoryComponent{ public categories : any = [ { name: 'Hotel', type: 'Company'}, { name: 'School', type: 'Company'} ]; }

カテゴリー.html

<form name="addCategoryForm" class="addCategoryForm" #addCategoryForm="ngForm" novalidate> <div class="form-group"> <label class="control-label">Category Type</label> <select class="form-control"

続きを読む →