Angular2更新

Question

I updated the angular2 to the latest version , also I updated my nodejs to the v6.9.5

After I did that I've got the next error

ERROR in Error encountered resolving symbol values statically. Expression form not supported (position 14:3 in the original .ts file), resolving symbol dictionary in C:/NodeJs/analytics/client/src/app/translate/translations.ts, resolving symbol TRANSLATI ON_PROVIDERS in C:/NodeJs/analytics/client/src/app/translate/translations.ts, resolving symbol TRANSLATION_PROVIDERS in C:/Node Js/analytics/client/src/app/translate/index.ts, resolving symbol AppModule in C:/NodeJs/analytics/client/src/app/app.module.ts, resolving symbol AppModule in C:/NodeJs/analytics/client/src/app/app.module.ts

Sometimes my project works and I don't understand what is the problem. Can someone help me to resolve this problem , please

Here is my app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule,ReactiveFormsModule }   from '@angular/forms';
import { HttpModule }    from '@angular/http';
import { MdCoreModule } from '@angular2-material/core';
import { MdButtonModule } from '@angular2-material/button';
import { MdButtonToggleModule } from '@angular2-material/button-toggle';
import { MdCardModule } from '@angular2-material/card';
import { MdRadioModule } from '@angular2-material/radio';
import { MdCheckboxModule } from '@angular2-material/checkbox';
import { MdTooltipModule } from '@angular2-material/tooltip';
import { MdInputModule } from '@angular2-material/input';
import { MdToolbarModule } from '@angular2-material/toolbar';
import { MdTabsModule } from '@angular2-material/tabs';
import { MdSidenavModule } from '@angular2-material/sidenav';
import { MdProgressCircleModule } from '@angular2-material/progress-circle';
import { AppComponent } from './app.component';
import "hammerjs";
import { routing,  appRoutingProviders } from './app.routes';
import {RouterModule} from '@angular/router';
import { DashboardComponent } from './dashboard/dashboard.component';
import { IndexComponent } from './index/index.component';
import { LoginComponent } from './login/login.component';
import { NotFoundComponent } from './not-found/not-found.component';
import { IndexService }          from './services/index.service';
import { HttpClient }          from './services/http.client';
import { AuthenticationService }   from './services/authentication.service';
import { AuthGuard } from './_guard/auth-guard';
import { ErrorMessageComponent } from './error-message/error-message.component';

import { MenuComponent } from './menu/menu.component';
import { PageAnalysisComponent } from './page-analysis/page-analysis.component';
import { SettingsComponent } from './settings/settings.component';
import { SiteVsSiteComponent } from './site-vs-site/site-vs-site.component';
import { SidenavComponent } from './sidenav/sidenav.component';
import { SitesListComponent } from './sites-list/sites-list.component';
import { SeoOverviewComponent } from './seo-overview/seo-overview.component';
import { AnalysisContentComponent } from './analysis-content/analysis-content.component';
import { DesignComponent } from './design/design.component';
import { PerformanceComponent } from './performance/performance.component';
import { CheckerComponent } from './checker/checker.component';
import { Loading } from './loading/loading.component';
import { TRANSLATION_PROVIDERS, TranslatePipe, TranslateService }   from './translate';
import { ChartModule } from 'angular2-highcharts';
import {FacebookService} from 'ng2-facebook-sdk/dist';
import { MdUniqueSelectionDispatcher } from '@angular2-material/core';
import { FormBuilder, Validators} from '@angular/forms';
import { AccessibilityComponent } from './accessibility/accessibility.component';
import { SummaryComponent } from './summary/summary.component';
import { CloudComponent } from './cloud/cloud.component';
import { RemoveSpacesPipe } from './remove-spaces.pipe';
import { ActivationComponent } from './activation/activation.component';

@NgModule({
  declarations: [
    AppComponent,
    DashboardComponent,
    IndexComponent,
    LoginComponent,
    NotFoundComponent,
    ErrorMessageComponent,
    MenuComponent,
    PageAnalysisComponent,
    SettingsComponent,
    SiteVsSiteComponent,
    SidenavComponent,
    SitesListComponent,
    SeoOverviewComponent,
    AnalysisContentComponent,
    DesignComponent,
    PerformanceComponent,
    CheckerComponent,
    TranslatePipe,
    AccessibilityComponent,
    SummaryComponent,
    CloudComponent,
    RemoveSpacesPipe,
    Loading,
    ActivationComponent
  ],

  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule,
    routing,
    MdCoreModule,
    MdCardModule,
    MdButtonModule,
    MdRadioModule,
    ChartModule,
    MdCheckboxModule,
    MdTooltipModule,
    MdInputModule,
    MdToolbarModule,
    MdButtonToggleModule,
    MdTabsModule,
    MdSidenavModule,
    MdProgressCircleModule,
    MdRadioModule,
    ReactiveFormsModule
  ],
  providers: [appRoutingProviders,
              FacebookService,
              IndexService,
              TRANSLATION_PROVIDERS,
              TranslateService,
              AuthenticationService,
              MdUniqueSelectionDispatcher,
              FormBuilder,
              Validators,
              AuthGuard,
              HttpClient
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Answer 1

Changing

// app/translate/translations.ts
...
// all traslations
const dictionary = {
    [LANG_EN_NAME]: LANG_EN_TRANS,
    [LANG_ES_NAME]: LANG_ES_TRANS,
    [LANG_ZH_NAME]: LANG_ZH_TRANS,
};

to

// app/translate/translations.ts
...
// all traslations
const dictionary = {};
dictionary[LANG_EN_NAME] = LANG_EN_TRANS;
dictionary[LANG_ES_NAME] = LANG_ES_TRANS;
dictionary[LANG_ZH_NAME] = LANG_ZH_TRANS;

resolved this for me. I'm not sure why.

Also I suggest importing directly or using a module as opposed to using barrels( index.ts )