热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

如何在角度6中使用套接字服务?

如何解决《如何在角度6中使用套接字服务?》经验,为你挑选了1个好方法。

我是套接字的新手,所以我要在angular 6项目中实现套接字服务。

如何在Angular 6中使用套接字?

可能会使用一些很酷的套接字示例?

图书馆?教程?博客文章?



1> 小智..:

如何在角度6中使用套接字服务?

1.首先您必须创建像这样的角度组件:

socketComponent.ts

import { SocketDataService } from 'socketDataService';
import { Subscription } from 'rxjs';

@Component({
  selector: 'app-socket',
  templateUrl: './app-socket.component.html',
  styleUrls: ['./app-socket.component.css'],

})

export class SocketComponent implements OnInit {


  sub: Subscription;

  constructor(private socketDataService: SocketDataService) {}

    ngOnInit() {
      this.getSocketData();
    }

    getSocketData(): void {
    this.sub = this.socketDataService.getSocketData()
      .subscribe(data => {
        this.socketData = data
    })
  }
} 

2.您必须创建以下服务:

socketService.ts

import { Observable } from 'rxjs/Observable';

@Injectable()
export class SocketDataService {

    private socket;

    constructor(private http: Http) {
        this.socket = io('http://localhost:3000')
    }

    observer
    getSocketData(): Observable {
        this.socket.on('socket-data', (res) => {
            this.observer.next(res);
        });
        return this.getSocketDataObservable();
    }
    getSocketDataObservable(): Observable {
        return new Observable(observer => {
            this.observer = observer;
        });
    }
}


推荐阅读
author-avatar
清洁剂没看见家门口_200
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有