Kostiantyn Okhotnyk's questions

有一类 IndexedDb

   
class IndexedDb {

    constructor() {
        var self = this;
  

        var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB;

        if (!indexedDB) {
            return;
        }

        var open = indexedDB.open(db, 2);

        open.onupgradeneeded = function() {
            ...
        };

        open.onerror = function(event) {
            ...
        };

        open.onsuccess = function(event) {
            debugger;
            console.log("onsuccess")
            ...
        }


    }
}

if(!Indexeddb) {
var Indexeddb = new IndexedDb();
}

export default Indexeddb;

问题是 open.onsuccess 不起作用。如果您从控制台运行代码，那么一切正常

var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB;
    var open = indexedDB.open(db, 2);
    debugger;
    open.onsuccess = function (event) {
        debugger;
        console.log("onsuccess");
        self.db = event.target.result;
    };

这种行为可能有什么问题？

请帮助我了解应用程序的优化。Angular2上有应用。我按照这篇文章做了最小化。没有网络包。团队

 browserify -s main dist/main.js > dist/bundle.js

和

uglifyjs dist/bundle.js --screw-ie8 --compress --mangle --output dist/bundle.min.js

结果是最小化束，但需要 1.7 米。该项目的 app.module.ts 结构在我看来非常大。

@NgModule({
  imports: [
    BrowserModule,
    CommonModule,
    FormsModule,
    Ng2PaginationModule,
    HttpModule,
    FormsModule,
    DatePickerModule,
    Ng2GoogleChartsModule,
    routing,
    AgmCoreModule.forRoot({
      apiKey: 'AIzaSyAqIBAiCeLH9A5I5lqEK3iK1j3gAmL3yIg',
      libraries:['geometry', 'places']
    })
  ],
  declarations: [
    MainComponent,
    AuthComponent,
    RecoveryComponent,
    BaseComponent,
    IndexComponent,
    UsersComponent,
    ActiveDriversComponent,
    AdminsComponent,
    ClientComponent,
    DriversApplicationsComponent,
    ActiveDriverComponent,
    ActivationComponent,
    OrdersCanceledComponent,
    AllOrderForDriverComponent,
    NewUserComponent,
    DriverRateComponent,
    DeterminationErrors,
    HttpPopupErrors,
    TranslatePipe,
    CKEditorComponent,
    OrdersComponent,
    SelectLanguageComponent,
    SelectRoleComponent,
    SelectNoticeComponent,
    CurrentOrdersComponent,
    NotConfirmedComponent,
    DeferredOrdersComponent,
    CompletedOrdersComponent,
    AbolishedOrdersComponent,
    DriversOffersComponent,
    EvaluationEditorComponent,
    NewOrderComponent,
    OrderInfoComponent,
    PermissionDeniedComponent,
    SelectBoxComponent,
    NewsComponent,
    CreateNewsComponent,
    EditNewsComponent,
    PublishedNewsComponent,
    SelectFilterComponent,
    ChangeStatusComponent,
    PaymentsTemplatesComponent,
    PaymentsComponent,
    NewTemplateComponent,
    NewTemplateComponent,
    ChangePasswordComponent,
    EditTemplateComponent,
    SupportComponent,
    TemplatesComponent,
    DraftsComponent,
    AppealsMessagesComponent,
    NotificationsComponent,
    NotificationComponent,
    CountriesComponent,
    AddCountryComponent,
    AddCityComponent,
    EditCountryComponent,
    EditCityComponent,
    CurrentBalanceComponent,
    MarkerClusterDirective,
    DriverMapDirective,
    PersonalDirective,
    AllInfoDirective,
    StatisticDirective,
    SearchDirective,
    DateRangePickerDirective,
    PersonalAutoDirective,
    DocumentsDirective,
    PaginationDirective,
    HelpersDirective,
    SimpleRateDirective,
    FilterPipe,
    PluralPipe
  ],
  providers: [
    Urls,
    User,
    SearchModel,
    HttpService,
    CurrencyService,
    Md5,
    DeterminationErrorService,
    TRANSLATION_PROVIDERS,
    TranslateService,
    LocationService
  ],
  schemas: [ CUSTOM_ELEMENTS_SCHEMA ],
  bootstrap:    [ MainComponent ]
})

与此相关，有一些问题。在这种情况下，模块的延迟加载是否有帮助，如果有帮助，那么如何将这个结构分解成单独的模块（原理本身不清楚）？
有没有其他方法可以优化应用程序？

你能告诉我如何覆盖 angular2 模板吗？有一个选择框模块 ng2-select。在这个模块中，您需要更改模板：添加一个自定义滚动条（ng2-slimscroll），稍微更改一下布局。问题是如何在angular2中实现这个？现在组件看起来像这样：

import {  Component } from '@angular/core';
import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from '@angular/common';

import {BUTTON_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap';
import {SELECT_DIRECTIVES } from 'ng2-select/ng2-select';

import {BaseComponent} from '../base/base.component';


@Component({
selector: 'content',
templateUrl: 'app/admin/generation/generation.component.html',
directives: [SELECT_DIRECTIVES],
styleUrls: ['../../node_modules/ng2-select/components/css/ng2-select.css']
})

export class GenerationComponent  {

public items:Array<string> = ['Amsterdam', 'Antwerp', 'Athens', 'Barcelona',
    'Berlin', 'Birmingham', 'Bradford', 'Bremen', 'Brussels', 'Bucharest',
    'Budapest', 'Cologne', 'Copenhagen', 'Dortmund', 'Dresden', 'Dublin',
    'Düsseldorf', 'Essen', 'Frankfurt', 'Genoa', 'Glasgow', 'Gothenburg',
    'Hamburg', 'Hannover', 'Helsinki', 'Kraków', 'Leeds', 'Leipzig', 'Lisbon',
    'London', 'Madrid', 'Manchester', 'Marseille', 'Milan', 'Munich', 'Málaga',
    'Naples', 'Palermo', 'Paris', 'Poznań', 'Prague', 'Riga', 'Rome',
    'Rotterdam', 'Seville', 'Sheffield', 'Sofia', 'Stockholm', 'Stuttgart',
    'The Hague', 'Turin', 'Valencia', 'Vienna', 'Vilnius', 'Warsaw', 'Wrocław',
    'Zagreb', 'Zaragoza', 'Łódź'];

private value:any = {};
private _disabledV:string = '0';
private disabled:boolean = false;

private get disabledV():string {
    return this._disabledV;
}

private set disabledV(value:string) {
    this._disabledV = value;
    this.disabled = this._disabledV === '1';
}

public selected(value:any):void {
    console.log('Selected value is: ', value);
}

public removed(value:any):void {
    console.log('Removed value is: ', value);
}

public typed(value:any):void {
    console.log('New search input: ', value);
}

public refreshValue(value:any):void {
    this.value = value;
}

}