小编Edw*_*ard的帖子

我有一段代码.

<table class="table table-bordered table-condensed" cellpadding="0" cellspacing="0">
    <thead>
        <tr>
            <th>#</th>
            <th>Name</th>
            <th>Score</th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="#participant of participants; #i = index">
            <td>{{i+1}}</td>
            <td>{{participant.username}}</td>
            <td>{{participant.score}}</td>
        </tr>
    </tbody>
</table>

在Angular 1中,我有orderBy过滤器来按我的过滤器对行进行排序.但是我怎样才能以相同的方式在Angular 2中进行orderBy？谢谢.

我开始构建一个应用程序.有很多组件.他们每个人都需要来自1个webSocket的一部分数据.webSocket接收对象的示例:

每个Angular 2组件需要1个来自接收对象的字段.是否可以创建1个服务,它将连接到webSocket,接收数据并在所有组件之间共享？我认为这将是一个很好的解决方案.

现在我正在使用下一个方法:

getConfigCallback() {
    this.connectionSockets.telemetry = io(this.config.connections.telemetry);
    this.connectionSockets.controlFlow = new WebSocket(this.config.connections.controlFlow.server + ':' + this.config.connections.controlFlow.port);

    this.connectionSockets.telemetry.on('telemetry', function(data) {
        console.log(data);
    });

    this.connectionSockets.controlFlow.onopen = function(data) {
        console.log('onOpen', data);
    };

    this.connectionSockets.controlFlow.onmessage = function(data) {
        console.log('onMessage', data);
    };
}

我在主要组件中接收数据,并希望使用组件的实例在组件之间共享它.但我认为这是一个坏主意,并且存在更好的解决方案.

我想将一个字符串参数传递给我的组件.根据传递参数,我将为我的组件中的服务传递不同的参数.我接下来做:在index.html中调用我的组件,传递参数.

<top [mode]="tree">Loading...</top>

在我的组件中,我包括来自angular2/core的输入

import {Input, Component, OnInit} from 'angular2/core';

在我的组件类中,我声明了一个输入

@Input() mode: string;

并且使用console.log()我尝试捕获'tree'的传递参数,但它未定义.

console.log(this, this.mode);

组件文件的完整代码:

import {Http, HTTP_PROVIDERS} from 'angular2/http';
import {Input, Component, OnInit} from 'angular2/core';
import {ParticipantService} from '../services/participant.service';
import {orderBy} from '../pipes/orderby.pipe';

@Component({
    selector: 'top',
    templateUrl: 'dev/templates/top.html',
    pipes: [orderBy],
    providers: [HTTP_PROVIDERS, ParticipantService]
})
export class AppTopComponent implements OnInit {

    constructor (private _participantService: ParticipantService) {}

    errorMessage: string;
    participants: any[];
    @Input() mode: string;

    ngOnInit() {
        console.log(this, this.mode);
        this.getParticipants('top3');
        var self = this;
        setInterval(function() {
            self.getParticipants('top3');
        }, 3000); …

我使用Angular 2,我需要使用Google Map.我需要初始化一个地图,创建一些带有路线坐标的数组,添加一个自定义HTML标记,添加一些事件监听器,绘制折线等等.所有这些都可以在网页上只使用原生JS.在我的工作中,我需要使用Angular2.我如何在组件内部初始化一个地图对象,并在一个组件内操纵它,就像对象一样？

有一个angular2-google-maps库,但它的功能有限.例如,我无法使用angular2-google-maps创建折线,我无法集成某些库,例如自定义HTML标记,cSnapToRoute等.

我有组件数据的下一个结构:

我想使用打印assignedCards组件视图中的列表*ngFor.我这样做可能:

<div *ngFor="#item of mission.assignedCards" class="b-progress-bar__item m-progress-bar__item_completed">
<div class="b-progress-bar__inner">{{item}}</div>
</div>

但它有一个例外:

如果我测试mission价值,它说我,这mission是一个对象.

所以,我想访问对象中的assignedCards数组mission并进行循环.