5
Tôi đã dành quá nhiều thời gian cho việc này, nhưng tôi bị kẹt và không thể tìm ra cách để có được Angular2 với Typecript để chạy. Tôi tiếp tục nhận được một 404 cho các thành phần:Angular2 with Typescript - Lỗi tải angular2/platform/browser
Lỗi tải http://localhost:5000/angular2/platform/browser là "angular2/nền tảng/trình duyệt" từ http://localhost:5000/appScripts/boot.js
Dưới đây là cấu trúc thư mục của tôi: 
index.html của tôi là:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Angular 2 with ASP.NET Core</title>
<!-- 1. Load libraries -->
<script src="libs/es6-shim/es6-shim.min.js"></script>
<script src="libs/zone.js/dist/zone.js"></script>
<script src="libs/reflect-metadata/Reflect.js"></script>
<script src="libs/systemjs/dist/system.src.js"></script>
<!-- 2. Configure SystemJS -->
<script src="./appScripts/config.js"></script>
<script>
System.import('appScripts/boot')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
Khởi động.TS:
/// <reference path="../node_modules/angular2/typings/browser.d.ts" />
import {bootstrap} from 'angular2/platform/browser'
import {AppComponent} from './app'
bootstrap(AppComponent);
Các app.ts:
/// <reference path="../typings/jquery/jquery.d.ts" />
/// <reference path="../typings/angularjs/angular-route.d.ts" />
/// <reference path="../typings/angularjs/angular.d.ts" />
import {Component} from 'angular2/core';
@Component({
selector: 'my-app',
template: 'My First Angular 2 App'
})
export class AppComponent { }
Các config.js
(function (global) {
// map tells the System loader where to look for things
var map = {
'app': 'appScripts', // 'dist',
'rxjs': 'libs/rxjs',
'angular2-in-memory-web-api': 'libs/angular2-in-memory-web-api',
'@angular': 'libs/@angular'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
'app': { main: 'boot.js', defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' },
'angular2-in-memory-web-api': { defaultExtension: 'js' },
};
var packageNames = [
'@angular/common',
'@angular/compiler',
'@angular/core',
'@angular/http',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/router',
'@angular/router-deprecated',
'@angular/testing',
'@angular/upgrade',
];
// add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
packageNames.forEach(function (pkgName) {
packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});
var config = {
map: map,
packages: packages
}
// filterSystemConfig - index.html's chance to modify config before we register it.
if (global.filterSystemConfig) { global.filterSystemConfig(config); }
System.config(config);
})(this);
Dưới đây là chi tiết của cấu trúc thư mục để cung cấp cho bạn một ý tưởng tốt hơn về cơ cấu dự án. 
Đây là package.json tôi
{
"version": "1.0.0",
"name": "ASP.NET",
"private": true,
"dependencies": {
"@angular/common": "2.0.0-rc.1",
"@angular/compiler": "2.0.0-rc.1",
"@angular/core": "2.0.0-rc.1",
"@angular/http": "2.0.0-rc.1",
"@angular/platform-browser": "2.0.0-rc.1",
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
"@angular/router": "2.0.0-rc.1",
"@angular/router-deprecated": "2.0.0-rc.1",
"@angular/upgrade": "2.0.0-rc.1",
"systemjs": "0.19.27",
"es6-shim": "^0.35.0",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.6",
"zone.js": "^0.6.12",
"angular2-in-memory-web-api": "0.0.7"
},
"devDependencies": {
"gulp": "^3.9.0",
"gulp-autoprefixer": "~3.1.0",
"gulp-concat": "~2.6.0",
"gulp-imagemin": "~2.4.0",
"imagemin-pngquant": "~4.2.0",
"jshint": "2.9.2",
"gulp-jshint": "2.0.0",
"jshint-stylish": "~2.1.0",
"rimraf": "~2.5.1",
"gulp-minify-css": "~1.2.4",
"gulp-sass": "2.2.0",
"gulp-uglify": "~1.5.1",
"gulp-sourcemaps": "~1.6.0",
"gulp-plumber": "1.1.0",
"gulp-notify": "2.2.0",
"beepbeep": "1.2.0",
"gulp-rename": "1.2.2",
"gulp-sourcemap": "1.0.1",
"gulp-clean-css": "2.0.6",
"main-bower-files": "2.13.0",
"gulp-filter": "4.0.0",
"typescript": "^1.8.10",
"gulp-typescript": "^2.13.1",
"live-server": "1.0.0",
"typings": "^1.0.4",
"gulp-tsc": "^1.1.5"
}
}
Cảm ơn bạn trước sự giúp đỡ của bạn và xin vui lòng cho tôi biết nếu tôi có thể cung cấp một số chi tiết.
Cảm ơn Yurzui .... Bạn có nghĩa là trong vòng boot.ts, tôi nên thay đổi dòng này 'import {bootstrap} từ 'angular2/platform/browser'' thành' import {bootstrap} này từ '@ angular/platform-browser-dynamic'' –
@Matt Knight Có chính xác – yurzui
Tôi có thể bị nhầm lẫn RC1 với beta. Tôi đã không nghĩ về điều đó. Tuy nhiên, thay đổi đó một mình không hoàn toàn làm điều đó. Tôi vẫn nhận được: ** http: // localhost: 6722/angular2/core Không tải được tài nguyên: máy chủ trả lời với trạng thái 404 (Không tìm thấy) zone.js: 323 Lỗi: Lỗi: Lỗi XHR (404 Không tìm thấy) tải http: // localhost: 6722/angular2/core (…) ** Cảm ơn bạn một lần nữa vì đã giúp đỡ bạn. –