TypeScript angular2/platform/browser bootstrap示例

示例#1

文件： main.ts 项目： shazy655/ng2

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

import {SampleService} from './sampleService';          //import service

@Component({
    selector: 'main-selector',
    template: `<br/> <h3>Main Component</h3>
                <ul><li *ngFor="#v of myList">{{v}}</li></ul>`,
    providers: [SampleService]
})
export class MainComponent {
    myList: string[];
    
    constructor(public myService: SampleService) {
            this.myList = myService.getSampleData();  
    } 
    
}



bootstrap(MainComponent);

示例#2

文件： bootstrap.ts 项目： rodrigouroz/angular2-presentation

import {bootstrap}    from 'angular2/platform/browser';
import {enableProdMode} from 'angular2/core';
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
import {BackendService} from './app/services/backend';
import {MainComponent} from './app/main';

if ('development' !== process.env.ENV) {
  enableProdMode();
}

bootstrap(MainComponent, [ROUTER_PROVIDERS, HTTP_PROVIDERS, BackendService]);

示例#3

文件： boot.ts 项目： laudrup69/Angular2

import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from './app.component';

bootstrap (AppComponent)
.then (success => console.log('Bootstrap successfully!'))
.catch(err => console.log(err));

示例#4

文件： main.ts 项目： DotHide/angular2-quickstart

import {bootstrap} from 'angular2/platform/browser'
import {Component} from 'angular2/core';
import {TodoService} from "./todo/services/todo-service";
import {TodoInput} from './todo/components/todo-input';
import {TodoList} from "./todo/components/todo-list";
import {StatusSelector} from "./todo/components/status-selector";
import {SearchBox} from "./todo/components/search-box";

@Component({
  selector: 'todo-app',
  directives: [TodoInput, TodoList, StatusSelector, SearchBox],
  template: `<div>
    <search-box (update)="term = $event"></search-box>
    <todo-input></todo-input>
    <status-selector (select)="status = $event"></status-selector>
    <todo-list [status]="status" [term]="term"></todo-list>
  </div>`
})
class TodoApp{}
bootstrap(TodoApp, [TodoService]);

示例#5

文件： bootstrap.ts 项目： beeva-miguelsarries/angular2-cli

import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from './app/app.component';
import {ROUTER_PROVIDERS} from 'angular2/router';
// import {enableProdMode} from 'angular2/core';

bootstrap(AppComponent, [
  ROUTER_PROVIDERS
]);

// enableProdMode();

示例#6

文件： main.1.ts 项目： austinglenn/angular.io

import {bootstrap}    from 'angular2/platform/browser';
import {AppComponent} from './app.component';
import {HeroService}  from './heroes/hero.service';

//#docregion bootstrap
// Injecting services in bootstrap works but is discouraged
bootstrap(AppComponent, [HeroService]);
//#enddocregion bootstrap

示例#7

文件： app.component.ts 项目： christiannwamba/auth0-angular2

import {AUTH_PROVIDERS} from 'angular2-jwt';

import {Home} from './home.component';
import {Ping} from './ping.component';
import {Profile} from './profile.component';
import {Auth} from './auth.service';

@Component({
  selector: 'app',
  providers: [ Auth ],
  directives: [ ROUTER_DIRECTIVES ],
  templateUrl: 'src/app.template.html',
  styles: [`.btn-margin { margin-top: 5px}`]
})
@RouteConfig([
  { path: '/home',  name: 'Home',  component: Home, useAsDefault: true },
  { path: '/ping',  name: 'Ping',  component: Ping },
  { path: '/profile',  name: 'Profile',  component: Profile }
])
export class App {

  constructor(private auth: Auth) {}

}

bootstrap(App, [
  HTTP_PROVIDERS,
  ROUTER_PROVIDERS,
  AUTH_PROVIDERS,
  provide(LocationStrategy, { useClass: HashLocationStrategy })
])

示例#8

文件： main.ts 项目： julianlopezv/AngularJS

import {bootstrap} from 'angular2/platform/browser';
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HeroService} from './hero.service';
import {AppComponent} from './app.component';

bootstrap(AppComponent, [
  ROUTER_PROVIDERS,
  HeroService
]);



/*
Copyright 2016 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
*/

示例#9

文件： boot.ts 项目： Radeg/a2-weather-app

import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from "./app.component";
import {HTTP_PROVIDERS} from "angular2/http";
import {WeatherService} from './weather/weather.service';

bootstrap(AppComponent, [HTTP_PROVIDERS, WeatherService]);

示例#10

文件： main.ts 项目： volyasmith/dating_site

import { bootstrap } from "angular2/platform/browser";
import { MyApp } from "./app";
bootstrap(MyApp);