有人可以帮助将此承诺转换为RxJs可观察对象吗?我想从本地存储中获取令牌,如果出现错误,应该使用订阅了observable的观察者来捕获它.以下是Promise的现有解决方案:
getToken(): Promise<any> {
return new Promise<any>((resolve, reject) => {
resolve(JSON.parse(localStorage.getItem('currentUser')).token);
reject();
});
}
Run Code Online (Sandbox Code Playgroud)
和订户是:
this.authService.getToken().then(token => {
this.token = token;
}).catch(() => console.log('Error! cannot get token'));
Run Code Online (Sandbox Code Playgroud)
我尝试使用以下方法将其转换为Observable:
getToken2(): Rx.Observable<number> {
return Rx.Observable.create(obs => {
obs.next(JSON.parse(localStorage.getItem('currentUser')).token);
obs.error('Error! cannot get token');
});
}
Run Code Online (Sandbox Code Playgroud)
和
this.authService.getToken2()
.subscribe((token) => console.log(token), (er) => console.log(er));
Run Code Online (Sandbox Code Playgroud)
但问题是当从localstorage获取令牌时发生错误时,RxJs observable不会通过obs.next()捕获它.就好像它已成功解析.Promise通过拒绝方法成功捕获它.可以有人给出一个想法怎么了?谢谢
当我订阅 getAllSubModules forkJoin 时,会无错误地执行所有这些 observable 但没有完成。我知道 forkJoin 仅在其所有 observables 完成后才完成,但作为证据,我在控制台中看到 '-----' 3 次,确认一切都成功,因此其所有 observables 已完成。
getSubmodules(id): Observable<any> {
return this.authService.getToken()
.flatMap((token) => this.http.get(`${this.URL}/ROS/applications/modules/${id}/subModules?token=${token}`))
.map((res: any) => res.data.map((subModule) => this.mapSubModules(subModule)));
}
getAllSubmodules(): Observable<any> {
const tasks = [];
this.modules.forEach((module: AppModule) => {
const obs = this.getSubmodules(module.id).map((subModules) => {
this.allSubModules[module.id] = subModules;
console.log('--------------------');
});
tasks.push(obs);
});
return Observable.forkJoin(...tasks).retry(2);
}
mapSubModules(moduleData) {
if (moduleData.id) {
const subModule = <SubModule> {
id: moduleData.id,
parentId: moduleData.parentId,
typeId: moduleData.typeId,
name: moduleData.name.az,
active: true
};
return subModule; …Run Code Online (Sandbox Code Playgroud) 请查看Stackblitz或下面的代码
存在以下问题:来自 :root 的变量未设置为元素。但是当我重命名:root => .component时。它按预期工作。显示该框。
为什么 :root 变量没有设置?它们不是全局性的还是特异性问题?
提前致谢。
社会保障体系:
:host {
display: block;
}
:root {
--profile-picture-size-w: 9rem;
--profile-picture-size-h: 9rem;
--profile-picture-border: 1px solid #1e96a9;
--profile-box-backgound-size: cover;
--profile-box-p: 20px 0;
--article-dateInfo: 3px;
}
.component{
height: 500px;
background: lightgray;
#main_content {
.scrollbarContent{
article#profile {
.profileBox {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: var(--profile-box-p);
.profilePicture {
position: relative;
width: var(--profile-picture-size-w);
height: var(--profile-picture-size-h);
background: cyan;
}
}
}
}
}
}
@media all and (min-width: …Run Code Online (Sandbox Code Playgroud) 我有一个表格,即使其内容较少,也可以缩放到所有可用宽度。
演示:“ https://plnkr.co/edit/6L8bTAwkEV6R6Be4M1Qm?p=preview ”
尝试通过给父级 awidth和 ag-grid来解决它max-width,但如您所见,它没有效果。有人有什么想法吗?
提前致谢。
我很沮丧,因为我运行了构建,但它不会在项目文件夹中生成dist文件夹.我对其他项目没有任何问题.奇怪的是,编译器不会给出任何错误.有人可以检查我的项目并告诉原因吗? https://github.com/vugar005/Report 亲切的问候
我目前正在使用一个项目。它工作正常,但是当我将项目文件(除了node_modules)删除到另一个文件夹或 GitHub 时出现问题,通过 npm 重新安装包不成功。它总是挂在
extract:rxjs: sill extract big.js@3.1.3
我试过npm cache verify没有运气。
这是 packages.json
{
"name": "esas",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^4.2.4",
"@angular/cdk": "^2.0.0-beta.10",
"@angular/common": "^4.2.4",
"@angular/compiler": "^4.2.4",
"@angular/core": "^4.2.4",
"@angular/forms": "^4.2.4",
"@angular/http": "^4.2.4",
"@angular/material": "^2.0.0-beta.10",
"@angular/platform-browser": "^4.2.4",
"@angular/platform-browser-dynamic": "^4.2.4",
"@angular/router": "^4.2.4",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.3",
"angular2-loaders-css": "^1.0.9",
"angular2-perfect-scrollbar": "^2.0.6",
"bootstrap": "^4.0.0-beta",
"core-js": …Run Code Online (Sandbox Code Playgroud) 我需要制作响应表,甚至可以在移动视图中呈现而不会分解.为了使它工作,我使用下面的标准HTML表链接
<div style="overflow-x:auto;">
<table>
...
</table>
</div>
Run Code Online (Sandbox Code Playgroud)
看看样本:https://www.w3schools.com/howto/howto_css_table_responsive.asp
它工作得很好但最近切换到Angular 5表,它没有响应式设计的API.如何将overflow-x auto添加到角表?样本角5表:
https://stackblitz.com/edit/angular-material-table-data-source-ibmgv2 提前致谢
Stackblitz: https: //stackblitz.com/edit/angular-xvdy1q
我想打印特定的div.
<div id="forPrint" (click)="onPrint('23')">
<div id="printable">
<div class="box">
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
JavaScript 代码:
onPrint(url) {
this.mode = 'print';
const mywindow = window.open('', 'PRINT', 'height=400,width=600');
mywindow.document.write(`<html><head><title>${document.title}</title>`);
mywindow.document.write('</head><body >');
mywindow.document.write(`<h1> www.${url}</h1>`);
mywindow.document.write(document.getElementById('forPrint').innerHTML);
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10*/
mywindow.print();
mywindow.close();
return true;
}
Run Code Online (Sandbox Code Playgroud)
风格:
@media print {
html,
body {
height: 100% !important;
width: 100%!important;
h1 {
color: #1c7430;
}
}
#printable {
display: flex!important;
justify-content: center!important;
align-items: …Run Code Online (Sandbox Code Playgroud) angular ×7
css ×4
html ×4
rxjs ×3
rxjs5 ×2
sass ×2
ag-grid ×1
angular-cli ×1
javascript ×1
npm ×1
npm-install ×1
npm-scripts ×1