2016-10-19 11 views
1

私はcomponent-relative paths angular documentationの後にいます。セレクタ "relative-path"が要素と一致しません

手順に従って、コンポーネントtsとコンポーネントhtmlを同じディレクトリに保存しています。この質問の目的のために、そのディレクトリには、最初の/アプリ/コンポーネント/

マイコンポーネントTSで次のコードが含まれており、First.component.ts

import {Component, Injectable} from '@angular/core'; 
import {MyService} from "../../service/MyService"; 
import {ValueObj} from "../../value/ValueObj"; 

@Component({ 
    moduleId: module.id, 
    selector: 'relative-path', 
    templateUrl: 'First.component.html', 
    providers: [MyService] 
}) 

@Injectable() 
export class FirstComponent { 

    public valueObjs: ValueObj[]; 

    constructor(private _myService: MyService) {} 

    getAllItems(): void { 
     this._myService.getAllValueObjs().subscribe(
      data => this.valueObjs= data, error=> console.log(error), 
      () => console.log("getting complete")); 
    } 
} 

マイFirst.componentという名前です。私はこのソリューション、The selector "my-app" did not match any elements見てきました

<form (ngSubmit)="getAllItems()"> 
<label>Value Objects</label> 
<button type="submit">Search</button> 
</form> 
<hr> 
<p style="color:red">{{error}}</p> 
<h1>All Objects</h1> 
<div *ngFor="let valueObj of valueObjs">{{valueObj.name}}</div> 

、しかし、私はそれが適用見つからない:HTMLは次のコードが含まれています。

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

// start the application 
const platform = platformBrowserDynamic(); 
platform.bootstrapModule(AppModule); 

をしてBrowserModuleへの参照を持っていない:私のmain.tsファイルには、これだけが含まれています。私もwhy getting the error "The selector did not match any elements"?を見ましたが、私の値を比較するためのboot.tsファイルはありません。

最後に、私はAngular2 CLI build EXCEPTION : The selector "app-root" did not match any elementsを見てきましたが、私はパッケージングで角度ユニバーサルへの参照がありません.json。

私が間違っていることは何ですか?

答えて

1

私はちょうど同じ問題を抱えていました。この例はちょっと混乱しています。

selector: 'relative-path', 

は、コンポーネントの単なる例であり、相対パスを使用するコマンドではありません。

moduleId行を単に追加すると、相対パスが機能するため、selectorを「最初の要素」または以前のものとして残すことができます。

エラーメッセージは実際にあなたが現在持っているセレクタ( "相対パス")がindex.htmlファイルにあるものと一致していないと言うことを実際に試みています。これは、app.moduleのbootstrapエントリにあるコンポーネントを変更した場合にのみ発生します。ブートストラップ以外のモジュールで同じ問題が発生した場合、はるかに明確なエラーメッセージが表示されます。

+0

あなたは正しいですか?私は相対的な経路を働かせることをあきらめていたが、あなたの解決策は私を助けてくれた;)歓声 – angryip

関連する問題