從rc4升級到rc5：設置依賴關係

我回顧了這方面的相關答案，並發現它們在確定引導rc5應用程序的設置時非常有幫助。不過，我仍然收到錯誤，如下設置我的文件後：從rc4升級到rc5：設置依賴關係

app.module.ts

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
//import { FormsModule } from '@angular/forms' 
import { APP_BASE_HREF } from '@angular/common'; 
import { RouterModule } from '@angular/router'; 
import { HttpModule } from '@angular/http'; 
import { AppComponent } from './app.component'; 
import { routes } from './app.routes'; 
import { Router } from '@angular/router'; 
import { Calendar, DataTable, Column, InputMask } from 'primeng/primeng'; 

import { FooModule } from './+foo/foo.module'; 
import { BarModule } from './+bar/bar.module'; 
import { BooModule } from './+boo/boo.module'; 
@NgModule({ 
    imports: [BrowserModule, 
      HttpModule, 
      RouterModule, 
      FooModule, 
      BarModule, 
      BooModule 
    ], 
    declarations: [AppComponent,Calendar, DataTable, Column, ], 
    providers: [ 
    { 
     provide: APP_BASE_HREF, 
     useValue: '<%= APP_BASE %>', 
    }], 
    bootstrap: [AppComponent] 

}) 

export class AppModule { }

我的組件和模塊是這樣的：

import { NgModule }      from '@angular/core'; 
import { CommonModule, NgControl }     from '@angular/common'; 
//import { FormsModule }     from '@angular/forms'; 

import { SomeDirective } from '../../SomeDirective.directive'; 
import { SomePipe } from '../../SomePipe.pipe'; 
import { SomeService } from './SomeService.service'; 

import { ContextMenu, Menu } from 'primeng/primeng'; 

@NgModule({ 
    imports: [//modules 

    ], 
    declarations: [//Directives, components and pipes 
     SomeDirective, SomePipe 
    ], 
    providers: [//services 
     NgControl, SomeService 
    ] 
}) 

export class FooModule {}

和

import {RouterModule, Router} from '@angular/router' 
import { HttpModule } from '@angular/http'; 
import { Component, Input, OnInit } from '@angular/core'; 
import { FormBuilder, FORM_DIRECTIVES, NgControl } from '@angular/common'; 
import { MenuItem} from 'primeng/primeng'; 
import { SomeService } from './SomeService.service'; 
import { someInterface } from './someInterfaces'; 


@Component({ 
    moduleId: module.id, 
    selector: '...', 
    templateUrl: '....html', 
    styleUrls: ['....component.css'], 
}) 


export class PatientSearchComponent implements OnInit { 
    stateService: SomeService; 
    obj: any[] = []; 

    constructor(private aService: SomeService, private router: Router, aService: SomeService) { 
... } 

    someFunction() { 
    ... 
    }); 
}

我在git上有一些答案，特別是https://github.com/angular/angular/issues/10805和https://github.com/angular/angular/issues/10617。根據＃brandonroberts的評論，我將我的依賴關係放入聲明，導入等。（一個部分我不確定，也許這是問題出在哪裏（雖然兩種方式我去了，我得到一個錯誤....），是共享組件去哪兒了。使用它們，或app.module的？或者它的）app.module的聲明？

我收到以下錯誤:(去各個模塊，

localhost/:142 Error: TypeError: Cannot read property 'type' of null(…)

這似乎是一個問題與app.module.ts，但它是什麼？

謝謝！

編輯的index.html

<body> 

    <sd-app>Loading...</sd-app> 

    <script> 
    // function.name (all IE) 
    // Remove once https://github.com/angular/angular/issues/6501 is fixed. 
    /*! @source http://stackoverflow.com/questions/6903762/function-name-not-supported-in-ie*/ 
    if (!Object.hasOwnProperty('name')) { 
    Object.defineProperty(Function.prototype, 'name', { 
     get: function() { 
     var matches = this.toString().match(/^\s*function\s*((?![0-9])[a-zA-Z0-9_$]*)\s*\(/); 
     var name = matches && matches.length > 1 ? matches[1] : ""; 
     // For better performance only parse once, and then cache the 
     // result through a new accessor for repeated access. 
     Object.defineProperty(this, 'name', {value: name}); 
     return name; 
     } 
    }); 
    } 
    </script> 

    <script> 
    // Fixes undefined module function in SystemJS bundle 
    function module() {} 
    </script> 

    <!-- shims:js --> 
    <!-- endinject --> 

    <% if (ENV === 'dev') { %> 
    <script> 
    System.config(<%= 
     JSON.stringify(SYSTEM_CONFIG, null, 2) 
    %>) 
    </script> 
    <% } %> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 

    <!--<script src="node_modules/ng2-bootstrap/bundles/ng2-bootstrap.min.js"></script>--> 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <!-- libs:js --> 
    <!-- endinject --> 

    <!-- inject:js --> 
    <!-- endinject --> 

    <% if (ENV === 'dev') { %> 
    <script> 
    System.import('<%= BOOTSTRAP_MODULE %>') 
    .catch(function (e) { 
     console.error(e, 
     'Report this error'); 
    }); 
    </script> 
    <% } %> 
</body>

加入以下文件： main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppModule } from './app.module'; 
platformBrowserDynamic().bootstrapModule(AppModule);

和+富/ index.ts

export * from './foo.component'; 
export * from './foo.routes';

來源

2016-08-23 Ahuva

爲什麼你給提供者添加'NgControl'。我認爲應該導入'FormsModule'和'ReactiveFormsModule'。 –

我假設'foo， bar， boo'都是模塊嗎？ –

導入'RouterModule'應該足夠了，'ROUTER_DIRECTIVES''在聲明中不需要。 AFAIK'聲明：[]'應該只包含當前模塊的組件和指令。 –

是什麼原因造成的誤差事實上，我是通過導入部分導入模塊，而不是聲明。必須刪除所有依賴項並逐個添加它們以追蹤哪個項目導致錯誤。

來源

2016-08-23 21:08:31 Ahuva

從rc4升級到rc5：設置依賴關係

回答

相關問題