import – 如何在Jsfiddle中使用Angular2和Typescript

发布时间：2020-12-17 07:43:07 所属栏目：安全来源：网络整理

导读：虚拟问题… 我尝试在jsfiddle的Typescript中编写一个angular2(2.0.0-beta.6)应用程序. 我知道有其他解决方案在线但… 其实我的例子很小,问题在于导入模块： import {bootstrap} from 'angular2/platform/browser'import {Component} from 'angular2/core';

虚拟问题…
我尝试在jsfiddle的Typescript中编写一个angular2(2.0.0-beta.6)应用程序.
我知道有其他解决方案在线但…
其实我的例子很小,问题在于导入模块：

import {bootstrap} from 'angular2/platform/browser'
import {Component} from 'angular2/core';

我得到以下错误：

Uncaught ReferenceError: System is not defined
Uncaught ReferenceError: require is not defined

我尝试添加一些依赖项(require,system …),但它不起作用.
而对于Angular2(angular2.sfx.dev.js)的最新版本(beta-6),还没有更多的自我执行软体包.

一些测试：
https://jsfiddle.net/asicfr/q8bwosfn/1/
https://jsfiddle.net/asicfr/q8bwosfn/3/
https://jsfiddle.net/asicfr/q8bwosfn/4/
https://jsfiddle.net/asicfr/q8bwosfn/5/
https://jsfiddle.net/asicfr/q8bwosfn/6/

在Plunker中,您可以使用菜单

New > Angularjs > 2.0.x (TS)

获得最小的Angular2应用程序

路由器

如果你想使用路由器添加在config.js

'@angular/router': {
  main: 'router.umd.js',defaultExtension: 'js'
},

< base href =“.”>作为< head>中的第一个孩子的index.html也可能是必要的.

切换到HashLocationStrategy从main更改main.ts

import {bootstrap} from '@angular/platform-browser-dynamic';
import {App} from './app';

bootstrap(App,[])
  .catch(err => console.error(err));

至

import {bootstrap} from '@angular/platform-browser-dynamic';
import {App} from './app';
import {provide} from '@angular/core'
import {ROUTER_PROVIDERS} from '@angular/router';
import {LocationStrategy,HashLocationStrategy} from '@angular/common';

bootstrap(App,[ROUTER_PROVIDERS,provide(LocationStrategy,{useClass: HasLocationStrategy}])
  .catch(err => console.error(err));

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!