// 假设我们有一个简单的AngularJS服务，用于获取用户信息
app.service('UserService', function($http) {
    this.getUser = function(userId) {
        return $http.get('/api/users/' + userId);
    };
});

// 假设我们有一个AngularJS控制器，它使用上述服务来获取和显示用户信息
app.controller('UserController', function($scope, UserService) {
    $scope.user = null;

    UserService.getUser(1).then(function(response) {
        $scope.user = response.data;
    });
});

import { Component } from '@angular/core';

@Component({
  selector: 'app-root', // 用于在HTML中引用此组件的标签
  templateUrl: './app.component.html', // 组件的HTML模板文件
  styleUrls: ['./app.component.css'] // 组件的CSS样式文件
})
export class AppComponent {
  title = 'My First Angular App'; // 组件的标题属性
}

npm install jquery --save

import * as $ from 'jquery';

import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core';

@Component({
  selector: 'app-example',
  template: `<div #jqueryElement>Content</div>`
})
export class ExampleComponent implements AfterViewInit {
  @ViewChild('jqueryElement') jqueryElement: ElementRef;

  ngAfterViewInit(): void {
    // 确保jQuery插件只在视图初始化后应用于DOM元素
    $(this.jqueryElement.nativeElement).someJqueryPlugin();
  }
}

npm install ng-zorro-antd

import { NgZorroAntdModule } from 'ng-zorro-antd';

@NgModule({
  imports: [
    // ...
    NgZorroAntdModule
  ],
  // ...
})
export class AppModule { }

<nz-tree
  [nzData]="nodes"
  nzDraggable
  (nzDrop)="dropNode($event)"
  (nzDragEnd)="dragEnd($event)">
</nz-tree>

import { CdkDragDrop } from '@angular/cdk/drag-drop';

// ...

nodes = [
  { title: '0-0', key: '0-0', children: [{ title: '0-0-0', key: '0-0-0' }] },
  // ...
];

dropNode(event: CdkDragDrop<string[]>) {
  moveItemInArray(this.nodes, event.previousIndex, event.currentIndex);
}

dragEnd(event: CdkDragEnd) {
  // 可以在这里处理拖拽结束后的逻辑
}

import { moveItemInArray } from '@angular/cdk/drag-drop';

import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {

  constructor() { }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // 假设我们有一个可以获取认证token的方法
    const token = this.getToken();

    // 如果请求已经包含了一个Authorization头，我们不应该添加另一个
    if (!req.headers.has('Authorization')) {
      // 克隆请求并添加Authorization头
      const authReq = req.clone({
        headers: req.headers.set('Authorization', `Bearer ${token}`)
      });
      // 然后传递克隆的请求到下一个拦截器或者服务器
      return next.handle(authReq);
    }

    // 如果请求已经有Authorization头，我们应该保持原样
    return next.handle(req);
  }

  // 这个函数应该返回有效的认证token
  private getToken(): string {
    // 实现获取token的逻辑
    return 'your-auth-token';
  }
}

vue create my-vue-app
cd my-vue-app

vue add electron-builder

module.exports = {
  pluginOptions: {
    electronBuilder: {
      mainProcessFile: 'src/electron.js',
      // ...其他配置
    },
  },
  // ...其他配置
};

npm run electron:build

# 安装nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

# 或者使用wget
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

# 重新加载shell配置
source ~/.bashrc

# 或者重新打开一个新的终端

# 安装特定版本的Node.js
nvm install 14.17.0

# 切换到目标Node.js版本
nvm use 14.17.0

# 安装Angular CLI
npm install -g @angular/cli

# 创建新的Angular项目
ng new my-project

# 进入项目目录
cd my-project

# 启动Angular项目
ng serve --open

npm install ngx-qrcode --save

import { QRCodeModule } from 'ngx-qrcode';

@NgModule({
  imports: [
    // ...
    QRCodeModule
  ],
  // ...
})
export class AppModule { }

<qrcode [value]="qrData" [size]="200" [level]="'H'" [useCrossOrigin]="false"></qrcode>

import { Component } from '@angular/core';

@Component({
  selector: 'app-qrcode-example',
  templateUrl: './qrcode-example.component.html',
  styleUrls: ['./qrcode-example.component.css']
})
export class QrcodeExampleComponent {
  qrData = '这里是二维码内容';
}

import { Component } from '@angular/core';

@Component({
  selector: 'app-parent',
  template: `
    <app-child (childEvent)="receiveMessage($event)"></app-child>
    <p>从子组件接收的消息: {{ messageFromChild }}</p>
  `
})
export class ParentComponent {
  messageFromChild: string;

  receiveMessage(message: string) {
    this.messageFromChild = message;
  }
}

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'app-child',
  template: `
    <button (click)="sendMessage()">发送消息给父组件</button>
  `
})
export class ChildComponent {
  @Output() childEvent = new EventEmitter<string>();

  sendMessage() {
    this.childEvent.emit('Hello from Child!');
  }
}