2015-12-22 3 views
11

Я создаю компонент, как это: (от образца)Как `угловое2 'экспортирует компонент?

import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'my-app', 
    template: '<h1> ~ My First Angular 2-0 App By Gulp Automation ~ </h1>' 
}) 

export class AppComponent { } //what it is exporting here? 

и импортировать в другой модуль:

import {bootstrap} from 'angular2/platform/browser' 
import {AppComponent} from './app.component' //what it's imports here 

bootstrap(AppComponent); //it works. 

в index.html:

<script> 
     System.config({ 
     packages: {   
      app: { 
      format: 'register', //what is means? 
      defaultExtension: 'js' 
      } 
     } 
     }); 
     System.import('app/boot') 
      .then(null, console.error.bind(console)); 
    </script> 

I я не могу понять логику, кто-нибудь мне помогает?

благодарит заранее.

ответ

5

Я думаю, что эти ссылки могут помочь вам: https://angular.io/guide/quickstart и https://daveceddia.com/angular-2-dependencies-overview/.

На самом деле SystemJS несет ответственность за реализацию логики модуля и связи между ними. Вот почему вам нужно включить файл SystemJS (systemjs) на свою HTML-страницу и настроить его с помощью System.config и, наконец, загрузить основной компонент вашего приложения Angular2 с помощью System.import.

Вы используете SystemJs при запуске System.import. В других элементах вашего приложения инструмент используется неявно, особенно если вы используете TypeScript. В этом случае достаточно простого import, чтобы импортировать другой модуль. Если вы посмотрите на файлы с расширением (файлы JavaScript), вы увидите, что используется SystemJS.

Приложение SystemJS Конфигурация (https://angular.io/docs/ts/latest/quickstart.html#!#systemjs) может дать вам несколько советов о конфигурации SystemJS для приложения Angular2

Вот ссылка на документацию относительно формата модулей (атрибут format в System.config блоке) : https://github.com/systemjs/systemjs/blob/master/docs/module-formats.md. Используя значение register для атрибута format, вы указываете, что System.register используется для определения модулей.

Надеется, что это помогает, Тьерри

1

компонентов, как модуль, который упаковывает некоторый код внутри, и другой модуль, чтобы использовать, когда и экспортировать этот «модуль»

import {AppComponent} from './app.component' 

AppComponent это имя класса, angular2 знать имя компонента «AppComponent» который служил «./app.component» означает «тот же каталог и найти файл с именем„app.component.ts“

Я новичок в NG2, надеюсь, что это может помочь U

+0

так что 'import' берет целый файл вместо класса. это? – user2024080

+0

Импорт «имени модуля» из «библиотеки» имеет смысл, если вы изучили язык oop, например python, «библиотека», возможно, такая угловая библиотека, как «angular2/core» ../ common .. и т. Д., В противном случае u может быть импортирована локально модуль типа «app.component» с ../, ../../, ./ этот шаблон – mckit

2

экспорту класса AppComponent {} // что вывозит здесь?

Это объясняется (кратко) в Architecture Overview руководстве:

export class AppComponent { }

Экспорт оператор говорит машинопись, что это модуль, AppComponent класс является открытым и доступным для других модулей заявление.

Когда нам нужна ссылка на AppComponent, мы импортируем его, как это:

import {AppComponent} from './app.component';

Оператор импорта сообщает системе, что может получить AppComponent от модуля имени app.component, расположенного в соседнем файл. Имя модуля (id модуля AKA) часто совпадает с именем файла без его расширения.

Смежные вопросы