Angular 2 本地模板变量的用户输入.pdfVIP

Angular 2 本地模板变量的⽤户输⼊ 描述 您可以使⽤本地模板变量显⽰⽤户数据，并且可以使⽤带有散列 （# ）字符的标识符 来 义此变量。 例⼦ 以下⽰例描述了Angular 2 中的本地模板变量的⽤户输⼊: !DOCTYPE html html head titleAngular 2 User Input from ocal Template Variable/titl script src=/attachments/w3c/es6-shim.min.js/script script src=/attachments/w3c/system-polyfills.js/script script src=/attachments/w3c/angular2-polyfills.js/script script src=/attachments/w3c/system.js/script script src=/attachments/w3c/typescript.js/script script src=/attachments/w3c/Rx .js/script script src=/attachments/w3c/angular2.dev .js/script script System.config({ transpiler: typescript, typescriptOptions: { emitDecoratorMetadata: true }, packages: {app: {defaultExtension: ts}} }); System.import(/angular2/src/app/user_input_loop_back) .then(null, console.error.bind(console)); /script /head body loop-back-event oading.../loop-back-event /body /html 上述代码包括以下配置选项： 您可以使⽤typescript版本配置index .html⽂件。在使⽤transpiler选项运⾏应⽤程 序之前，SystemJS将TypeScript转换为JavaScript 。 如果在运⾏应⽤程序之前没有翻译到JavaScript ，您可能会看到浏览器中隐藏的 编译器警告和错误。 当设置emitDecoratorMetadata选项时，TypeScript会为代码的每个类⽣成元数 据。如果不指 此选项，将⽣成⼤量未使⽤的元数据，这会影响⽂件⼤⼩和对 应⽤程序运⾏时的影响。 Angular 2包括来⾃app⽂件夹的包，其中⽂件将具有.ts扩展名。 接下来它将从应⽤程序⽂件夹加载主组件⽂件。如果没有找到主要组件⽂件， 那么它将在控制台中显⽰错误。 当Angular调⽤main .ts中的引导函数时，它读取Component元数据，找到 app”选 择器，找到⼀个名为app 的元素标签，并在这些标签之间加载应⽤程序。 要运⾏代码，您需要以下TypeScript(.ts)⽂件，您需要保存在应⽤程序⽂件夹下。 user_input_loop_back.ts import {bootstrap} from angular2/platform/browser; import { oopBackEventComponent} from ./loop_ponent; bootstrap( oopBackEventComponent); 现在我们将在TypeScript(.ts)⽂件中创建⼀个组件，如下所⽰： loop_ponent.ts import {Component} from angular2/core; @Component({ selector: loop-back-event, template:` h2Get user input from a local template variable/h2 !--declare a local template variable by preceding an identifi in