chore(version): upgrade to angular2 beta-0
This commit is contained in:
@@ -1,8 +1,9 @@
|
||||
/// <reference path="../../tsd.d.ts" />
|
||||
|
||||
import {Component, View, CORE_DIRECTIVES} from 'angular2/angular2';
|
||||
import {Component, View} from 'angular2/core';
|
||||
import {CORE_DIRECTIVES} from 'angular2/common';
|
||||
|
||||
import {tabs} from 'ng2-bootstrap/ng2-bootstrap';
|
||||
import {TAB_DIRECTIVES} from 'ng2-bootstrap/ng2-bootstrap';
|
||||
import {SimpleDemo} from './file-upload/simple-demo';
|
||||
|
||||
let name = 'File Upload';
|
||||
@@ -23,7 +24,7 @@ tabDesc.forEach(desc => {
|
||||
<tab heading="${desc.heading}" (select)="select($event)">
|
||||
<div class="card card-block panel panel-default panel-body">
|
||||
|
||||
<${desc.heading.toLowerCase()}-demo *ng-if="currentHeading === '${desc.heading}'"></${desc.heading.toLowerCase()}-demo>
|
||||
<${desc.heading.toLowerCase()}-demo *ngIf="currentHeading === '${desc.heading}'"></${desc.heading.toLowerCase()}-demo>
|
||||
|
||||
<br>
|
||||
|
||||
@@ -52,9 +53,7 @@ tabDesc.forEach(desc => {
|
||||
});
|
||||
|
||||
@Component({
|
||||
selector: 'file-upload-section'
|
||||
})
|
||||
@View({
|
||||
selector: 'file-upload-section',
|
||||
template: `
|
||||
<section id="${name.toLowerCase()}">
|
||||
<div class="row">
|
||||
@@ -71,7 +70,7 @@ tabDesc.forEach(desc => {
|
||||
</div>
|
||||
</section>
|
||||
`,
|
||||
directives: [SimpleDemo, tabs, CORE_DIRECTIVES]
|
||||
directives: [SimpleDemo, TAB_DIRECTIVES, CORE_DIRECTIVES]
|
||||
})
|
||||
export class FileUploadSection {
|
||||
private currentHeading:string = 'Simple';
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
<h3>Select files</h3>
|
||||
|
||||
<div ng2-file-drop
|
||||
[ng-class]="{'nv-file-over': hasBaseDropZoneOver}"
|
||||
[ngClass]="{'nv-file-over': hasBaseDropZoneOver}"
|
||||
(file-over)="fileOverBase($event)"
|
||||
[uploader]="uploader"
|
||||
class="well my-drop-zone">
|
||||
@@ -29,7 +29,7 @@
|
||||
</div>
|
||||
|
||||
<div ng2-file-drop
|
||||
[ng-class]="{'another-file-over-class': hasAnotherDropZoneOver}"
|
||||
[ngClass]="{'another-file-over-class': hasAnotherDropZoneOver}"
|
||||
(file-over)="fileOverAnother($event)"
|
||||
[uploader]="uploader"
|
||||
class="well my-drop-zone">
|
||||
@@ -46,7 +46,7 @@
|
||||
<div class="col-md-9" style="margin-bottom: 40px">
|
||||
|
||||
<h3>Upload queue</h3>
|
||||
<p>Queue length: {{ uploader.queue.length }}</p>
|
||||
<p>Queue length: {{ uploader?.queue?.length }}</p>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
@@ -59,18 +59,18 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ng-for="#item of uploader.queue">
|
||||
<td><strong>{{ item.file.name }}</strong></td>
|
||||
<td *ng-if="uploader.isHTML5" nowrap>{{ item.file.size/1024/1024 | number:'.2' }} MB</td>
|
||||
<td *ng-if="uploader.isHTML5">
|
||||
<tr *ngFor="#item of uploader.queue">
|
||||
<td><strong>{{ item?.file?.name }}</strong></td>
|
||||
<td *ngIf="uploader.isHTML5" nowrap>{{ item?.file?.size/1024/1024 | number:'.2' }} MB</td>
|
||||
<td *ngIf="uploader.isHTML5">
|
||||
<div class="progress" style="margin-bottom: 0;">
|
||||
<div class="progress-bar" role="progressbar" [ng-style]="{ 'width': item.progress + '%' }"></div>
|
||||
<div class="progress-bar" role="progressbar" [ngStyle]="{ 'width': item.progress + '%' }"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span *ng-if="item.isSuccess"><i class="glyphicon glyphicon-ok"></i></span>
|
||||
<span *ng-if="item.isCancel"><i class="glyphicon glyphicon-ban-circle"></i></span>
|
||||
<span *ng-if="item.isError"><i class="glyphicon glyphicon-remove"></i></span>
|
||||
<span *ngIf="item.isSuccess"><i class="glyphicon glyphicon-ok"></i></span>
|
||||
<span *ngIf="item.isCancel"><i class="glyphicon glyphicon-ban-circle"></i></span>
|
||||
<span *ngIf="item.isError"><i class="glyphicon glyphicon-remove"></i></span>
|
||||
</td>
|
||||
<td nowrap>
|
||||
<button type="button" class="btn btn-success btn-xs"
|
||||
@@ -94,7 +94,7 @@
|
||||
<div>
|
||||
Queue progress:
|
||||
<div class="progress" style="">
|
||||
<div class="progress-bar" role="progressbar" [ng-style]="{ 'width': uploader.progress + '%' }"></div>
|
||||
<div class="progress-bar" role="progressbar" [ngStyle]="{ 'width': uploader.progress + '%' }"></div>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-success btn-s"
|
||||
@@ -115,4 +115,4 @@
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,13 +1,8 @@
|
||||
/// <reference path="../../../tsd.d.ts" />
|
||||
|
||||
import {
|
||||
Component, View, EventEmitter,
|
||||
CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgStyle
|
||||
} from 'angular2/angular2';
|
||||
|
||||
import {FileSelect} from '../../../components/file-upload/file-select';
|
||||
import {FileDrop} from '../../../components/file-upload/file-drop';
|
||||
import {FileUploader} from '../../../components/file-upload/file-uploader';
|
||||
import {Component} from 'angular2/core';
|
||||
import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgStyle} from 'angular2/common';
|
||||
import {FILE_UPLOAD_DIRECTIVES, FileUploader} from '../../../ng2-file-upload';
|
||||
|
||||
// webpack html imports
|
||||
let template = require('./simple-demo.html');
|
||||
@@ -16,11 +11,9 @@ let template = require('./simple-demo.html');
|
||||
const URL = 'https://evening-anchorage-3159.herokuapp.com/api/';
|
||||
|
||||
@Component({
|
||||
selector: 'simple-demo'
|
||||
})
|
||||
@View({
|
||||
selector: 'simple-demo',
|
||||
template: template,
|
||||
directives: [FileSelect, FileDrop, NgClass, NgStyle, CORE_DIRECTIVES, FORM_DIRECTIVES]
|
||||
directives: [FILE_UPLOAD_DIRECTIVES, NgClass, NgStyle, CORE_DIRECTIVES, FORM_DIRECTIVES]
|
||||
})
|
||||
export class SimpleDemo {
|
||||
private uploader:FileUploader = new FileUploader({url: URL});
|
||||
|
||||
Reference in New Issue
Block a user