ứng dụng góc 2 không tải nhưng tôi không nhận được lỗi

Khi tôi tải ứng dụng thử nghiệm dạng góc 2 của bản mẫu, nó không tải như mong đợi.ứng dụng góc 2 không tải nhưng tôi không nhận được lỗi

Tôi luôn thấy "Đang tải ..." từ ứng dụng của tôi trong tệp html chỉ mục là gì.

Tôi cũng không gặp lỗi trong bảng điều khiển cung cấp trình duyệt:/

Có ai đang gặp lỗi không?

INDEX

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 

    <title>test</title> 
    <script src="~/lib/es6-shim.js"></script> 
    <script src="~/lib/es6-promise.js"></script> 
    <script src="~/lib/system-polyfills.js"></script> 
    <script src="~/lib/angular2-polyfills.js"></script> 
    <script src="~/lib/system.js"></script> 
    <script src="~/lib/Rx.js"></script> 
    <script src="~/lib/angular2.js"></script> 
    <script src="~/lib/http.dev.js"></script> 
    <script src="~/lib/router.dev.js"></script> 
    <script> 
      System.config({ 
       packages: { 
        app: { 
         format: 'register', 
         defaultExtension: 'js' 
        } 
       } 
      }); 
      System.import('app/main') 
        .then(null, console.error.bind(console)); 
    </script> 
</head> 
<body> 
    <my-app>Loading...</my-app> 
</body> 
</html>

main.ts

///<reference path="../node_modules/angular2/typings/browser.d.ts"/> 

import {provide} from 'angular2/core'; 
import {bootstrap, ELEMENT_PROBE_PROVIDERS} from 'angular2/platform/browser'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {AppComponent} from './app.component' 

bootstrap(AppComponent).catch(err => console.error(err));

app.component.ts

import {Component} from 'angular2/core'; 
@Component({ 
    selector: 'my-app', 
    // providers: [...FORM_PROVIDERS], 
    // directives: [...ROUTER_DIRECTIVES, RouterActive], 
    pipes: [], 
    styles: [], 
    template: ` 
     <h1>Hello {{ name }}</h1>  
    ` 
}) 
export class AppComponent { 
    angularclassLogo = 'assets/img/angularclass-avatar.png'; 
    name = 'Angular 2 Webpack Starter'; 
    url = 'https://twitter.com/AngularClass'; 
    constructor() { 

    } 
}

Nguồn

2016-02-27 Elisabeth

Mã có vẻ ổn với tôi. Tôi thậm chí đã thử nó trên thiết lập của tôi, nó hoạt động tốt trên phiên bản beta.7. hiện các tập tin .ts của bạn được biên dịch sang .js?, bạn cũng có thể đặt một console.log ngay trước khi bootstrap (..) trong main.ts – Abdulrahman

mã của bạn có vẻ là hoàn hảo. giống như @Abdulrahman, mã của bạn đang hoạt động tốt trên hệ thống của tôi. một lần nữa kiểm tra giao diện điều khiển của bạn để tải tập tin đúng cách? –

Tôi đã xem bảng điều khiển. không có gì ... – Elisabeth

Hãy thử nghiên cứu Ang lớn ular2 Plunker https://angular.io/resources/live-examples/quickstart/ts/plnkr.html (nguyên cảo)

Bạn đang sử dụng nguyên cảo, nhưng không có nó bao gồm trong HTML và cấu hình đúng trong systemjs:

// Missing typescript transpiler 
<script src="https://code.angularjs.org/tools/typescript.js"></script> 

<script> 
System.config({ 
    transpiler: 'typescript',       // <-- missing! 
    typescriptOptions: { emitDecoratorMetadata: true }, 
    packages: {'app': {defaultExtension: 'ts'}} // <-- you have bad extension 
}); 
System.import('app/main')    // <-- main.ts should be inside 'app' folder! 
     .then(null, console.error.bind(console)); 
... 
</script>

Ngoài ra, tôi không nghĩ rằng đó là ok để sử dụng dấu ngã ~ ký tự trong thuộc tính src của tập lệnh.

CẬP NHẬT

Nếu bạn đã có mã .ts bạn transpiled vào .js, hãy chắc chắn rằng bạn biên dịch nó với trang trí thực nghiệm kích hoạt - bạn tsconfig.json nên tương tự như sau:

{ 
    "compilerOptions": { 
    "target": "ES5", 
    "experimentalDecorators": true 
    } 
}

Nguồn

2016-02-27 11:25:16 mseimys

Tại sao tôi nên bao gồm kiểu chữ trong tệp index.html của mình? Tôi chuyển tệp .ts sang.tệp js và các tệp .js đã được systemJS đưa vào! Dấu ngã được cho phép bởi vì tôi sử dụng tệp asp.net .cshtml. – Elisabeth

Đó là phần quan trọng của thông tin tôi đã bỏ lỡ trong bài đăng đầu tiên của bạn. Cập nhật câu trả lời của tôi với một dự đoán khác. – mseimys

Tôi có điều này quá khác tôi sẽ nhận được một ngoại lệ transpile (mà tôi đã có ;-)). Nhưng tôi đã tìm thấy lỗi. Tôi xóa thư mục đích transpile của tôi và biên dịch lại tất cả mọi thứ sau đó nó làm việc một lần nữa?! Odd ... – Elisabeth

Tôi gặp sự cố trong mẫu của mình. Tôi đã xóa Mobx và ng2-mobx khỏi một ứng dụng nhưng quên xóa *mobxAutorun khỏi mẫu. Loại bỏ các chỉ thị làm cho nó hoạt động.

(Rõ ràng góc không hiển thị bất kỳ lỗi nào nếu chúng ở trong mẫu. Điều này có thể thực sự là một tính năng, để nếu bạn có ngIf thất bại, nó sẽ chỉ xem xét nếu sai, thay vì hiển thị lỗi. Không biết nếu có thể thay đổi hành vi này.)

Nguồn

2017-01-27 15:59:13

ứng dụng góc 2 không tải nhưng tôi không nhận được lỗi

Trả lời

Các vấn đề liên quan