Last active
June 5, 2019 22:54
-
-
Save branflake2267/0af4b6ae8e696bdd0b18da40b80af075 to your computer and use it in GitHub Desktop.
Simple Sencha ExtAngular App, one file
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>My ExtAngular app example</title> | |
| <base href="/"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link rel="icon" type="image/x-icon" href="favicon.ico"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=10, user-scalable=yes"> | |
| </head> | |
| <body> | |
| <app-root></app-root> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; | |
| import { BrowserModule } from '@angular/platform-browser'; | |
| import { NgModule, Component } from '@angular/core'; | |
| import { ExtAngularModule } from '@sencha/ext-angular' | |
| declare var Ext: any | |
| @Component({ | |
| selector: 'app-root', | |
| styles: [` | |
| `], | |
| template: ` | |
| <container #item padding="10"> | |
| <button #item | |
| text="Say Hello" | |
| [handler]="this.sayHello" | |
| ui="action raised" | |
| ></button> | |
| <button #item | |
| text="Say Goodbye" | |
| [handler]="this.sayGoodbye" | |
| ></button> | |
| <div #item> | |
| {{ this.message }} | |
| </div> | |
| </container> | |
| ` | |
| }) | |
| export class AppComponent { | |
| message: string; | |
| sayHello = () => { | |
| this.message = 'Hello world!'; | |
| } | |
| sayGoodbye = () => { | |
| this.message = 'Goodbye cruel world.'; | |
| } | |
| } | |
| @NgModule({ | |
| declarations: [ | |
| AppComponent | |
| ], | |
| imports: [ | |
| BrowserModule, ExtAngularModule | |
| ], | |
| providers: [ | |
| ], | |
| bootstrap: [ | |
| AppComponent | |
| ] | |
| }) | |
| export class AppModule {} | |
| platformBrowserDynamic().bootstrapModule(AppModule); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment