Angular 5 : Returning an Observable from a function

Question

在过去，我会定义一个新的 Promise，推迟它，然后在我的函数完成时解决它。现在我发现自己需要从一个函数返回一个 Observable ，并且我想确保在 Angular 5 上下文中正确设置它.

测试功能，工作正常:

getTreeViewChildren(currNode: any, nodeType: string, nodeTypeEnum: number = 0, nested: boolean = true)
                  : Observable<any> 
{

let treeObs: Observable<any>;

treeObs = new Observable(obs => {

	this.siteConfigService.getHostAccessPoints().subscribe(data => {
		let hostAccessPoints = JSON.parse(data);
		let accPointTree = this.findChildNodes(currNode, hostAccessPoints, nested);
		obs.next(accPointTree);
		obs.complete();	
	});		
	
});	
return treeObs;
}

并且从我的 NG 组件中我成功订阅:

this.configService.getTreeViewChildren(this.selectedTreeViewItem, type, nodetype, true).subscribe(tree =>{
	let theTree = tree;
 });	

然而，真正的函数有更多的检索逻辑。根据上面的测试功能设置 Observable 的正确方法是什么？完全相同的模式，只是将所有代码包装在 treeObs = new Observable(..) ?

getTreeViewChildNodes(currNode: any, nodeType: string, nodeTypeEnum: number = 0, nested: boolean = true): Observable<any> {
	let hosts;
	let locations;
	let hostAccessPoints;
	let treeResult: Observable<any>;

	if (nodeTypeEnum === NodeType.Location) {		
		// more code..
		let someTree = getStuff();
		return someTree;
	}

	if (nodeTypeEnum === NodeType.Host) {
		// more code..
		let someTree = getStuff();
		return someTree;
	}

	if (nodeTypeEnum === NodeType.HostAccessPoint) {
		let accPointTree;
		if (sessionStorage["hostAccessPoints"]) {
			// more code..
			let someTree = getStuff();
			return someTree;
		}
		else {
			this.siteConfigService.getHostAccessPoints().subscribe(data => {
				// more code..
				let someTree = getStuff();
				return someTree;
			});			
		}
	}

	if (nodeTypeEnum === NodeType.HostStorage) {
		// TO DO
	}		
  }

**** 已更新(基于 Observable.of() 建议的答案如下):

// Builds hierarchical treeview data
  getTreeViewChildNodes(currNode: any, nodeType: string, nodeTypeEnum: number = 0, nested: boolean = true): Observable<any> {
	let hosts;
	let locations;
	let hostAccessPoints;

	
	if (nodeTypeEnum === NodeType.Location) {
		if (sessionStorage["locations"] != null && sessionStorage["locations"] != "undefined") {			
			locations = JSON.parse(  sessionStorage.getItem('locations') );
		}
		// find child nodes
		let locationTree = this.findChildren(currNode, locations, nested);					
		return Observable.of(locationTree);
	}

	if (nodeTypeEnum === NodeType.Host) {
		if (sessionStorage["hosts"] != null && sessionStorage["hosts"] != "undefined") {			
			hosts = JSON.parse(  sessionStorage.getItem('hosts') );
		}
		// find child hosts for current node
		let hostTree = this.findChildHosts(currNode, hosts, nested);		
		return Observable.of(hostTree);
	}

	if (nodeTypeEnum === NodeType.HostAccessPoint) {
		let accPointTree;
		if (sessionStorage["hostAccessPoints"]) {
			hostAccessPoints = sessionStorage.getItem("hostAccessPoints");
			accPointTree = this.findChildHostAccessPoints(currNode, hostAccessPoints, nested);			
			return Observable.of(accPointTree);
		}
		else { // **** THREW ERROR FROM CALLER 'Cannot read property 'subscribe' of undefined****`
			/*this.siteConfigService.getHostAccessPoints().subscribe(data => {
				hostAccessPoints = JSON.parse(data);
				accPointTree = this.findChildHostAccessPoints(currNode, hostAccessPoints, nested);				
				return Observable.of(accPointTree);
			});*/			
                // ** CORRECTED CODE **
                return this.siteConfigService.getHostAccessPoints().map(data => {
				hostAccessPoints = JSON.parse(data);
				accPointTree = this.findChildHostAccessPoints(currNode, hostAccessPoints, nested);				
				return accPointTree;
			});      
      
		}
	}
  }

并且从我的组件代码中，它会抛出一个错误 TypeError: Cannot read property 'subscribe' of undefined 仅在我调用我的服务时，该服务又调用 http.get():

 this.configService.getTreeViewChildNodes(this.selectedTreeViewItem, type, nodetype, true).subscribe(data => {
        this.rebuildNetworkTree(data);
    });

Answer 1

我无法衡量有关您的第二个示例试图返回的内容的足够详细信息，但是执行第一个示例的更好方法是没有 new Observable(...) 内容。最好只使用 map operator转换数据。

getTreeViewChildren(currNode: any, nodeType: string, nodeTypeEnum: number = 0, nested: boolean = true): Observable<any> {
    return this.siteConfigService.getHostAccessPoints().map(data => {
        let hostAccessPoints = JSON.parse(data);
        let accPointTree = this.findChildHostAccessPoints(currNode, hostAccessPoints, nested);

        return 'test123';
    });
}

评论更新

如果你有一个有时使用异步操作有时不使用的函数，你可以使用 Observable.of() 进行非异步返回:

getTreeViewChildNodes(currNode: any, nodeType: string, nodeTypeEnum: number = 0, nested: boolean = true): Observable<any> {
    if (doSynchronousWork) {        
        // more code..
        let someTree = getStuff();
        return Observable.of(someTree);
    }

    if (doAsynchronousWork) {
        return this.siteConfigService.getHostAccessPoints().map(data => {
            // more code..
            let someTree = getStuff();
            return someTree;
        });
    }
}