首先，确保你已经安装了 Node.js 和 Angular CLI。如果没有安装，可以通过以下步骤安装：
1. 安装 Node.js： 前往 [Node.js 官网](https://nodejs.org/) 下载并安装最新的 LTS 版本。
2. 安装 Angular CLI： 打开终端并运行以下命令：
npm install -g @angular/cli
接下来，让我们创建一个简单的 Angular 应用：
步骤 1: 创建 Angular 应用
在终端中运行以下命令：
ng new hello-world-app
cd hello-world-app
步骤 2: 创建一个组件
在终端中运行以下命令，生成一个新的组件：
ng generate component hello-world
步骤 3: 编辑组件
打开生成的 hello-world.component.ts 文件，将组件的逻辑添加进去：
// src/app/hello-world/hello-world.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-hello-world',
templateUrl: './hello-world.component.html',
styleUrls: ['./hello-world.component.css']
})
export class HelloWorldComponent {
message = 'Hello, Angular!';
}
步骤 4: 编辑模板
打开生成的 hello-world.component.html 文件，将模板的内容添加进去：
<!-- src/app/hello-world/hello-world.component.html -->
<div>
<h1>{{ message }}</h1>
</div>
步骤 5: 在应用中使用组件
打开 src/app/app.component.html 文件，使用我们创建的组件：
<!-- src/app/app.component.html -->
<div style="text-align:center">
<h1>Welcome to {{ title }}!</h1>
<app-hello-world></app-hello-world>
</div>
步骤 6: 运行应用
回到终端，确保你仍在项目目录中，然后运行以下命令启动开发服务器：
ng serve
访问 http://localhost:4200/，你应该能够在浏览器中看到 "Hello, Angular!" 的消息。
这只是一个简单的示例，演示了如何创建一个 Angular 应用、生成组件以及进行组件和模板的基本编辑。在实际应用中，你可以通过学习 Angular 的更多特性，如服务、路由、依赖注入等，构建更复杂和功能丰富的应用。
转载请注明出处：http://www.pingtaimeng.com/article/detail/4901/Angular