前端之家收集整理的这篇文章主要介绍了
AngularJS2中最基本的文件说明,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
为应付坑爹的网络,参考网上配置npm的教程配置npm镜像 运行git clone https://github.com/angular/quickstart.git quickstart导出官网的例子。可以在这个例子的基础上面进行
修改。 main.ts 固定以下
代码。主要是为了启动
页面 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { AppModule } from './app.module'; const platform = platformBrowserDynamic(); platform.bootstrapModule(AppModule); app.module.ts 配置自己的类 import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import {FormsModule} from '@angular/forms';//进行双向绑定的时候要用 import { AppComponent } from './app.component'; import {SiteFormComponent} from './site/site-form.component';//导入自己定义的类,前面是类名,后面是路径 import {StartAppComponent} from './appcomp/appcomp'; @NgModule({ imports: [ BrowserModule,FormsModule ],declarations: [ AppComponent,SiteFormComponent,StartAppComponent ],//在这里
加上自己的类名 bootstrap: [ AppComponent ] }) export class AppModule { } app.component.ts
添加自己的类中的selector import { Component } from '@angular/core'; @Component({ selector: 'my-app',template: '<app-root></app-root>'//填写
自定义类中的selector }) export class AppComponent { } 以下是自己写的类 appcomp.ts 自己定义一个类 import {Component} from '@angular/core'; @Component({ moduleId: module.id,//这句话的作用是,
加上之后templateUrl会在此ts的目录找url。不加的话是以app目录为根目录找url selector:'app-root',//起一个名字,用于在app.module.js中
调用 templateUrl:'appcomp.html',//关联html
页面 // styleUrls:['./appcomp.css']//关联css
文件 }) export class StartAppComponent{ title='app works!'; } appcomp.html 自己定义一个html 这里不需要加head,body之类麻烦的
标签了,而且妈妈再也不用担心我的
中文会乱码了。