angular - Angular 2 Beta 9がRXJSを見つけられない

Question

RXJS から Subject と BehaviorSubject を使用して構築された基本的なサービスを取得するために何度も試みてきました...私の問題は、RXJS を含めるたびに TypeScript がエラーなしでコンパイルされることですが、次のエラーが発生します。

この投稿に基づいて index.html を更新した後、次のエラーが発生します (ページが読み込まれません)。

私はまだAngular 2、Typescript、およびRXJSにかなり慣れていないので、助けていただければ幸いです。関連するすべてのコードであると思われるものを以下に投稿しました。他に役立つ可能性があるものがある場合はお知らせください。リクエストされた部分で更新します。

Index.html ※更新

<html>
<head>
    <title>SCV Equipment Tracker</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 1. Load libraries -->
    <!-- IE required polyfills, in this exact order -->
    <script src="node_modules/es6-shim/es6-shim.min.js"></script>
    <script src="node_modules/systemjs/dist/system-polyfills.js"></script>
    <script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>

    <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <script src="node_modules/rxjs/bundles/Rx.js"></script>
    <script src="node_modules/angular2/bundles/angular2.dev.js"></script>
    <script src="node_modules/angular2/bundles/router.dev.js"></script>

    <!-- Front End Libraries -->
    <script src="node_modules/jquery/dist/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css">
    <script src="semantic/dist/semantic.min.js"></script>
    <link rel="stylesheet" type="text/css" href="template/css/main.css"/>

    <!-- 2. Configure SystemJS -->
    <script>
        System.config({
            defaultJSExtensions: true,
            paths: {
                // DON'T CHANGE KEY OF THIS PATH, CHANGE VALUE ONLY
                // IF YOU EXPOSE node_modules as public / static dir to your app, you can remove this line.
                'semantic-ui/dist/components/*': 'semantic/dist/components/*.js',
                // REQUIRED BY ANGULAR 2 ( CHANGE PATH )
            },
            map: {
                // IF YOU ARE NOT ABLE TO LOAD FROM node_modules
                // you must copy ng-semantic from /node_modules/ng-semantic
                // ( files: semantic.js, semantic.d.ts and folder: ng-semantic )
                // and set path to it
                'ng-semantic/semantic': 'node_modules/ng-semantic/semantic.js'
            },
            packages: {
                app: {
                    format: 'register',
                    defaultExtension: 'js'
                }
            }
        });
        System.import('app/boot')
                .then(null, console.error.bind(console));
    </script>
</head>

<!-- 3. Display the application -->
<body>
<eqTracker>
    <div class="ui active inverted dimmer">
        <div class="ui large text loader">Loading</div>
    </div>
</eqTracker>
</body>
</html>

{
  "name": "equipment-tracker-frontend",
  "version": "0.0.1",
  "description": "front end for equipment tracker",
  "main": "index.html",
  "scripts": {
    "start": "npm run tsc:w ",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "typings": "typings",
    "postinstall": "typings install"
  },
  "author": "",
  "license": "MIT",
  "dependencies": {
    "angular2": "2.0.0-beta.9",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "jquery": "^2.2.1",
    "ng-semantic": "^1.0.17",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.2",
    "semantic-ui": "^2.1.8",
    "systemjs": "0.19.24",
    "zone.js": "0.5.15"
  },
  "devDependencies": {
    "typescript": "^1.8.7",
    "typings": "^0.7.5"
  }
}

UserService.ts (これは ng-book 2 ユーザーサービスのクローンであり、角度 2 を学習していることに注意してください)

import {Injectable, bind} from 'angular2/core';
import {Subject, BehaviorSubject} from 'rxjs';

//Models
import {User} from "../models/user.model";

@Injectable()
export class UserService{
    currentUser: Subject<User> = new BehaviorSubject<User>(null);

    public setCurrentUser(newUser: User):void{
        this.currentUser.next(newUser);
    }
}

export var userServiceInjectables: Array<any> = [
    bind(UserService).toClass(UserService)
];

Thierry Templier の回答に基づいて更新されたエラーしたがって、Thierry の回答に基づいて index.html ページを更新すると、次のようになります。

今、私も角度のあるものをすべて見逃しています...

一時的な解決策で編集: それで、Thierry Templier のコメントのおかげで機能する解決策を見つけました...元のサービスから、インポートのような rx のものを含める必要がありました。{Subject, BehaviorSubject} from 'rxjs/Rx'; その後、既に持っていたマッピングでそれは機能しました

System.config({
        defaultJSExtensions: true,
        paths: {
            // DON'T CHANGE KEY OF THIS PATH, CHANGE VALUE ONLY
            // IF YOU EXPOSE node_modules as public / static dir to your app, you can remove this line.
            'semantic-ui/dist/components/*': 'semantic/dist/components/*.js',
            // REQUIRED BY ANGULAR 2 ( CHANGE PATH )
        },
        map: {
            // IF YOU ARE NOT ABLE TO LOAD FROM node_modules
            // you must copy ng-semantic from /node_modules/ng-semantic
            // ( files: semantic.js, semantic.d.ts and folder: ng-semantic )
            // and set path to it
            'ng-semantic/semantic': 'node_modules/ng-semantic/semantic.js',
            'angular2': 'node_modules/angular2',
            'rxjs': 'node_modules/rxjs'
        },
        packages: {
            app: {
                format: 'register',
                defaultExtension: 'js'
            }
        }
    });

この問題を解決しようとして私が読んだすべてのものから、Angular 2 Thierry Templier を学ぼうとすることは正しく、マッピングは必要ないはずです。私はもう一度その問題に飛び込んで解決しようとしますが、それが彼のコメントであり、角度を元に戻すのに役立ったので、彼の答えが受け入れられました.

angular - Angular 2 Beta 9がRXJSを見つけられない

1 に答える 1

Related

Reference