Question

目前，Angular 2处于第13个测试阶段。当我查看https://code.angularjs.org/2.0.0-beta.13/时，我可以看到有两个不同版本的Angular2：

angular2-all.umd.js
angular2.js

两者有什么区别？并且看起来angular2.js没有angular2.umd.js版本，为什么会这样？

Answer 1

实际上，如果要使用ES5实现Angular2应用程序，则必须使用angular2-all.umd.js。

angular2.js是使用ES6或TypeScript实现Angular2应用程序的核心模块。此文件必须与SystemJS等模块管理器一起使用。

<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>

Answer 2

如上所述，对于ES5，应使用UMD模块：angular2-all.umd.js和Rx.umd.js。对于Typescript或ES6，请使用angular2.js和Rx.js（他们还需要system.js）。

作为一种教育练习，也可以使用ES5的ES6样式模块：（https://jsfiddle.net/8g5809rg/）

<html>
<head>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/angular2.js"></script>

<script>

System.import("angular2/core").then(function(core) {

  ParentComponent.annotations = [
    new core.Component({
      selector: 'body',
      template: '<div (click)="go()">Parent</div><child [prop1]="x"></child>',
      directives: [ChildComponent]
    })
  ];

  function ParentComponent() {
    this.x = "hello1"
  }

  ParentComponent.prototype.go = function() {
    this.x += "1"
  };

  ///

  ChildComponent.annotations = [
    new core.Component({
      selector: 'child',
      inputs: ["prop1"],
      template: '<div>Child {{prop1}}</div>',
      changeDetection: core.ChangeDetectionStrategy.OnPush
    })
  ];

  function ChildComponent() {
  }

  ////////////////

  System.import("angular2/platform/browser").then(function(browser) {
    document.addEventListener('DOMContentLoaded', function() {
      browser.bootstrap(ParentComponent);
    });
  });
});
</script>
</head>

<body>
</body>
</html>

Angular2-all.umd.js和angular2.js

2 个答案: