小编Pat*_*607的帖子

Angular2空响应处理

在我当前的应用程序中,当它是一个空数组或者服务器需要很长时间才能回复时,我似乎无法从observable获得响应.这是我目前的状态:

getIncomingData():Observable<any[]> {
    console.log("GetIncomingData");
    return this.http.get('http://mylink/data')
        .map(data => this.extractIncomingData(data))
        .catch(this.handleError);
}

private extractIncomingData(res:Response):any[] {
    if (res.status < 200 || res.status >= 300) {
        throw new Error('Bad respons status: ' + res.status);
    }
    console.log(res.json());
    return <any>res.json();
}
Run Code Online (Sandbox Code Playgroud)

我尝试过使用.timeout我在其他地方找到的东西,但这似乎也没有用.我正在使用Angular2 rc1.有谁知道如何解决我的问题?谢谢.

angular

6
推荐指数
1
解决办法
1385
查看次数

在循环Angular2中创建多个元素

编辑:关于可能的答案:我也遇到了这个问题/答案并以这种方式实施.但是,对于新版本的Angular2,语法是不同的.关于ngFor的文档没有更新(这是我看的地方).所以我写了错误的代码.有关ngFor的文档在模板语法 - ngFor中更新.Günter写了一个关于如何在较新版本的Angular2(beta17或更高版本)中使用它的正确示例.

我想在循环中创建多个元素.这就是我现在拥有的:

<table>
    <thead>
        <th>ID</th>
        <th>Name</th>
    </thead>
    <tbody>
        <tr *ngFor="let item of items" class="info">
            <td>{{ item['id'] }}</td>
            <td>{{ item['name'] }}<td>
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

我想是有史以来下trtrdetails.在浏览器中,所需的输出应如下所示:

<table>
    <thead>
        <th>ID</th>
        <th>Name</th>
    </thead>
    <tbody>
        <tr class="info">
            <td>1</td>
            <td>Item 1<td>
        </tr>
        <tr class="details">
            <!-- More detailed info about item 1 -->
        </tr>
        <tr class="info">
            <td>2</td>
            <td>Item 2<td>
        </tr>
        <tr class="details">
            <!-- More detailed info about item 2 -->
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

我怎样才能达到预期的效果?

javascript angular

5
推荐指数
1
解决办法
5198
查看次数

CSS 按钮动画越来越大

我在 html/less 中创建了一个按钮,当你将鼠标悬停在按钮上时,按钮会变大。目前它非常草率。当您将鼠标悬停在按钮上时,它会变得更大,但我希望它变慢并具有动画效果。

这是我的 HTML 和 LESS 按钮代码:

HTML:

<div id="buttons">
  <a href="#" class="btn green">dance</a>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

.btn {
  border-radius: 5px;
  padding: 15px 55px;
  font-size: 22px;
  text-decoration: none;
  margin: 20px;
  color: #fff;
  position: relative;
  display: inline-block;
}

.btn:active {
  transform: translate(0px, 5px);
  -webkit-transform: translate(0px, 5px);
  box-shadow: 0px 1px 0px 0px;
}    

.green {
  background-color: #d7d7d7;
  box-shadow: 3px 5px 5px #888888;
  border-radius: 2px;   
}

.green:hover {
  background-color: #000;
/*  Making button bigger on hover  */
  padding: 20px 60px;
}
Run Code Online (Sandbox Code Playgroud)

那么我怎样才能让我的按钮变大变慢并且看起来有点动画呢?

html css

5
推荐指数
2
解决办法
2万
查看次数

如何在 Docker/devcontainer buildargs 中使用文件中的环境变量?

使用 VSCode devcontainer 我想在我的devcontainer.json. 目前我的devcontainer.json样子是这样的:

{
  "name": "NodeJS & TypeScript",
  "build": {
    "dockerfile": "Dockerfile",
    "args": {
      "VARIANT": "16-bullseye",
      "NPM_PROXY": "http://proxy.domain.com:8080",
      "HTTPS_PROXY": "http://proxy.domain.com:8080",
      "HTTP_PROXY": "http://proxy.domain.com:8080"
    }
  },
  "settings": {},
  "extensions": [
    // ...
  ],      
  "remoteUser": "node",
  "runArgs": ["--env-file", ".devcontainer/.env"]
}
Run Code Online (Sandbox Code Playgroud)

和我的Dockerfile

ARG VARIANT
FROM mcr.microsoft.com/vscode/devcontainers/typescript-node:0-${VARIANT}

RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
  && apt-get -y install --no-install-recommends chromium

WORKDIR /usr/app

ARG NPM_PROXY
RUN npm config set https-proxy ${NPM_PROXY} -g

RUN npm i -g @angular/cli

ENV …
Run Code Online (Sandbox Code Playgroud)

docker visual-studio-code vscode-devcontainer

5
推荐指数
0
解决办法
4779
查看次数

如何检查布尔列表中的值?

我有这个清单: List<bool> values = new List<bool>();

洋溢着: True,True,False,True,False,False,True

当我这样做: int amountTrue = values.Count(v => true); 它返回7.这只是List中的值.我认为它检查值是否存在,但这不是我想要的.

如何True使用Count或任何其他可链接方法获取List中的值?我知道我可以循环使用它,但我认为这可以更轻松.

c# visual-studio

4
推荐指数
1
解决办法
3109
查看次数

如何在子组件中触发click事件?

我想为点击的每个元素运行一个函数.这是目前的情况:

<!-- This is the parent-component -->
<template ngFor let-myData [ngForOf]="someData"> 
    <tr [item]="myData" (click)="toggleActive($event)" child-component>
</template>
Run Code Online (Sandbox Code Playgroud)

子组件看起来像这样:

<td>{{ item.data1 }}</td>
<td>{{ item.data2 }}</td>
<td>{{ item.data3 }}</td>
Run Code Online (Sandbox Code Playgroud)

每次单击时tr,我都希望在toggleActive我单击的子组件中触发-function.目前它在父组件中触发.我怎么能按照我想要的方式完成这项工作?

angular2-components angular

3
推荐指数
1
解决办法
1505
查看次数