Angular 使AoT与DI兼容

Angular 使AoT与DI兼容,angular,typescript,dependency-injection,ionic2,angular2-aot,Angular,Typescript,Dependency Injection,Ionic2,Angular2 Aot,我有一个使用angular rc4的工作项目,在将其更新为angular 2.0.0后,该项目正在崩溃 我有以下错误: 静态解析符号值时遇到错误。调用函数 不支持“createStore”函数调用。考虑更换 引用导出函数的函数或lambda, 解析符号应用商店 此代码不再工作: //Redux - ReduxThunk - rootReducer import { Store, createStore, applyMiddleware } from 'redux'; import ReduxTh

我有一个使用angular rc4的工作项目,在将其更新为angular 2.0.0后,该项目正在崩溃

我有以下错误:

静态解析符号值时遇到错误。调用函数 不支持“createStore”函数调用。考虑更换 引用导出函数的函数或lambda, 解析符号应用商店

此代码不再工作:

//Redux - ReduxThunk - rootReducer
import { Store, createStore, applyMiddleware } from 'redux';
import ReduxThunk  from 'redux-thunk';
import { rootReducer } from '../modules/rootReducer';

const appStore = createStore(
  rootReducer,
  applyMiddleware(ReduxThunk)
)

@NgModule({
...
  providers: [
    { provide: 'AppStore', useValue: appStore }
  ]
})
解决这个问题的最好办法是什么

这是我在app.ts中使用angular rc4的根组件的文件

import { Component, provide } from '@angular/core';
import { Platform, ionicBootstrap } from 'ionic-angular';
import { StatusBar } from 'ionic-native';

//For Navigation
import { TabsPage } from './pages/tabs/tabs';

//Redux
import { createStore, applyMiddleware } from 'redux';
import ReduxThunk  from 'redux-thunk';
import rootReducer from './modules/rootReducer';

const appStore = createStore(
  rootReducer,
  applyMiddleware(ReduxThunk)
);

@Component({
  template: `<ion-nav [root]="tabsPage"></ion-nav>`
})

export class MyApp {

    private tabsPage: any;

    constructor(
        private platform:Platform, 
        @Inject('AppStore') private appStore: any
        ) {
        });

        this.tabsPage = TabsPage;

        platform.ready().then(() => {
            // Okay, so the platform is ready and our plugins are available.
            // Here you can do any higher level native things you might need.
            StatusBar.styleDefault();
        });
    }   
}

ionicBootstrap(MyApp, [
    provide('AppStore', { useValue: appStore })
])
从'@angular/core'导入{组件,提供};
从“离子角度”导入{Platform,ionicBootstrap};
从“离子本机”导入{StatusBar};
//航行
从“./pages/tabs/tabs”导入{TabsPage};
//重演
从“redux”导入{createStore,applyMiddleware};
从“redux thunk”导入redux thunk;
从“./modules/rootReducer”导入rootReducer;
const appStore=createStore(
减根剂,
applyMiddleware(ReduxThunk)
);
@组成部分({
模板:``
})
导出类MyApp{
私人选项卡:任何;
建造师(
私有平台:平台,
@注入('AppStore')私有AppStore:任何
) {
});
this.tabsPage=tabsPage;
platform.ready()。然后(()=>{
//好了,平台准备好了,我们的插件也可以使用了。
//在这里,您可以做任何您可能需要的更高级别的本地操作。
StatusBar.styleDefault();
});
}   
}
ionicBootstrap(MyApp[
提供('AppStore',{useValue:AppStore})
])

如果createStore函数中的任何位置都使用了未命名/未报告的函数,则会出现相同的错误-很可能就是这种情况。我认为你有两个选择:

1.尝试修改代码,希望问题出在代码中。 我会像@estus推荐的那样尝试
useFactory
,但您必须使用命名函数,而不是匿名函数。它必须是函数引用,而不是指向函数的常量

export function appStore() {
  return createStore(
    rootReducer,
    applyMiddleware(ReduxThunk)
  );
}

@NgModule({
...
  providers: [
    { provide: 'AppStore', useFactory: appStore }
  ]
})
2.尝试使用角度更为友好的redux实现
我正在使用,效果很好。是另一个选项,但我还没有尝试过。

如果createStore函数中的任何地方使用了未命名/未报告的函数,则会出现相同的错误,很可能就是这种情况。我认为你有两个选择:

1.尝试修改代码,希望问题出在代码中。 我会像@estus推荐的那样尝试
useFactory
,但您必须使用命名函数,而不是匿名函数。它必须是函数引用,而不是指向函数的常量

export function appStore() {
  return createStore(
    rootReducer,
    applyMiddleware(ReduxThunk)
  );
}

@NgModule({
...
  providers: [
    { provide: 'AppStore', useFactory: appStore }
  ]
})
2.尝试使用角度更为友好的redux实现
我正在使用,效果很好。是另一个选项,但我没有尝试过。

您是否尝试用
useFactory:()=>createStore(…)
替换useValue?是的,它会给我相同的错误:静态解析符号值时遇到错误。不支持函数调用。考虑引用一个导出函数替换函数或lambda(在原.ts文件中的位置105:19),您是否试图用<代码> UsField:()= > CRATATESTORE(…)< /代码>替换UVALUE?是的,它给了我同样的错误:遇到静态解析符号值的错误。不支持函数调用。考虑引用一个导出函数替换函数或lambda(在原件.ts文件中的位置105:19),我已经用ReDux编程了所有的东西,所以我更喜欢第一个选项,它现在好像在工作。非常感谢你的回答。我通过函数引用进行了测试,但使用的是useValue而不是useFactory。我已经在这上面呆了一个多星期了!再次感谢。:)我已经用Redux编程了所有东西,所以我更喜欢第一个选项,而且它现在似乎正在工作。非常感谢你的回答。我通过函数引用进行了测试,但使用的是useValue而不是useFactory。我已经在这上面呆了一个多星期了!再次感谢。:)