角度2では使用します
ng g c componentname
しかし、Angular 4ではサポートされていないので、手動で作成しましたが、モジュールではないというエラーが表示されます。
Angular 4でもこれは同じように機能します。エラーが発生した場合、私はあなたの問題は他のどこかにあると思います。
コマンドプロンプト内
ng生成コンポーネントYOURCOMPONENTNAME
これにはいくつかの短所があります。コマンドgenerate
はg
として、component
はc
として使用できます。
あなたの会社名を入力してください
ドキュメントにはng --help
、ng g --help
またはng g c --help
を使用できます。
もちろん、YOURCOMPONENTNAMEという名前をあなたが使いたい名前に変更してください。
Docs: angular-cliはapp.module.tsに自動的にコンポーネント、ディレクティブ、パイプへの参照を追加します。
更新:これはAngularバージョン7でも動作します。
1)最初にあなたのプロジェクトディレクトリに行く
2)ターミナルのコマンドの下で実行します。
ng generate component componentname
_または_
ng g component componentname
3)その後、あなたはこのような出力を見るでしょう、
create src/app/test/componentname.component.css (0 bytes)
create src/app/test/componentname.component.html (23 bytes)
create src/app/test/componentname.component.spec.ts (614 bytes)
create src/app/test/componentname.component.ts (261 bytes)
update src/app/app.module.ts (1087 bytes)
ng g component componentname
コンポーネントを生成し、そのコンポーネントをモジュール宣言に追加します。
手動でコンポーネントを作成するときは、次のようにモジュールの宣言にコンポーネントを追加する必要があります。
@NgModule({
imports: [
yourCommaSeparatedModules
],
declarations: [
yourCommaSeparatedComponents
]
})
export class yourModule { }
.spec
ファイルを使わずに新しいコンポーネントを作りたい場合は、
ng g c component-name --spec false
ng g c --help
を使ってこれらのオプションを見つけることができます
プロジェクトのcmd行にいることを確認してください。
ng g component componentName
ng g c COMPONENTNAME
このコマンドは、angle2で使用する端子を使用してコンポーネントを生成するために使用します。
コンポーネントのcを生成するためのg
プロジェクトフォルダ名として 'app'を使用する代わりに、他のものに名前を変更したので、ng generate component component_nameは私の場合はうまくいきませんでした。私は再びそれをアプリに変えました。今、それはうまく働いています
ng g c componentname
次の4つのファイルが作成されます。
componentname.css
componentname.html
componentname.spec.ts
componentname.ts
開発サーバー経由でAngularプロジェクトを生成して提供する -
最初にあなたのプロジェクトディレクトリに行き、以下をタイプしてください -
ng new my-app
cd my-app
ng g component User
ng serve
ここで、「 D:\ Angular\my-app> 」はmy Angular applicationプロジェクトディレクトリ、「 User 」はコンポーネントの名前です。
Commonsは - のように見えます -
D:\Angular\my-app>ng g component User
create src/app/user/user.component.html (23 bytes)
create src/app/user/user.component.spec.ts (614 bytes)
create src/app/user/user.component.ts (261 bytes)
create src/app/user/user.component.css (0 bytes)
update src/app/app.module.ts (586 bytes)
私の場合は、私のsrc
フォルダーに別の.angular-cli.json
ファイルがあります。それを削除すると問題は解決しました。それが役に立てば幸い
angular 4.1.1
angular-cli 1.0.1
コマンドラインで、angle-cliプロジェクトのsrc/app
フォルダーにいるはずです。例えば:
D:\angular2-cli\first-app\src\app> ng generate component test
そうして初めてそれはあなたのコンポーネントを生成します。
ng g c --dry-runそうすれば、実際にやる前に何をしようとしているのかを見ることができますので、フラストレーションを減らすことができます。実際にそれを行わずに、それが何をしようとしているのかを示すだけです。
angularプロジェクトフォルダに移動して、コマンドプロンプトで「ng g component header」と入力します。headerは、作成する新しいコンポーネントです。デフォルトでは、ヘッダーコンポーネントはアプリコンポーネントの内部に作成されます。たとえば、上記のようにして作成したヘッダー内にコンポーネントを作成する場合は、「ng g component header/menu」と入力します。これにより、ヘッダコンポーネント内にメニューコンポーネントが作成されます。
指定フォルダ内のプロジェクトの場所に移動する
C:\Angular6\sample>
ここであなたはコマンドを入力することができます
C:\Angular6\sample>ng g c users
ここで、gは生成、cはコンポーネント、ユーザーはコンポーネント名です。
それは4つのファイルを生成します
users.component.html,
users.component.spec.ts,
users.component.ts,
users.component.css
cMDのプロジェクトディレクトリに移動して、以下のコマンドを実行します。 Visual Studioのコード端末も使用できます。
ng生成コンポーネント "component_name"
_または_
ng g c "component_name"
"component_name"の新しいフォルダが作成されます
component_name/component_name.component.html component_name/component_name.component.spec.ts component_name/component_name.component.ts component_name/component_name.component.css
新しいコンポーネントは自動的に追加されるモジュールになります。
以下のコマンドでspecファイルを作成しないようにすることができます。
ng g c "component_name" --nospec
ng g c COMPONENTNAME
は動作するはずです、もしあなたのモジュールが例外を見つけられないのなら、これらのことを試してください -
ng g component component name
この称賛を入力する前に、あなたはあなたのプロジェクトディレクティブパスにいるでしょう
Angular-cliを最新バージョンに更新しましたか?または、node、npm、またはtypescriptを更新してみましたか?この問題は、Angular/TypeScript/nodeのようなバージョンが原因で発生します。 cliを更新している場合は、こちらのリンクを使用してください。 https://github.com/angular/angular-cli/wiki/stories-1.0-update
ステップ1:
プロジェクトディレクトリに入る! (作成したアプリにcd)。
ステップ2:
次のコマンドを入力して実行してください。
ng generate component [componentname]
_または_
ng generate c [componentname]
両方ともうまくいく
参考のためにAngularドキュメントのこのセクションをチェックしてください。
https://angular.io/tutorial/toh-pt1
参考のためにgithubのAngularCliへのリンクもチェックしてください。
https://github.com/angular/angular-cli/wiki/generate-component
特定のフォルダーの下にコンポーネントを作成するため
ng g c employee/create-employee --skipTests=false --flat=true
フォルダを作成せずに
ng g c create-employee --skipTests=false --flat=true
この行は、create-employeeコンポーネントを作成する下にemployeeという名前のフォルダーを作成します。
ngコンポーネントcomponentNameを生成します。
それは自動的にmodule.tsのコンポーネントをインポートします
Angularでng g c <component_name>
を使用して新しいコンポーネントを生成するには、主に2つの方法があります。もう1つの方法は、ng generate component <component_name>
を使用することです。これらのコマンドの1つを使用して新しいコンポーネントを生成できます。