问在ServerCommandStatusComponent上找不到指令批注

EN

import {Component, View, OnInit} from "angular2/core";
import EndPointService  from '../../services/EndPointService';
import ObservableCommandService from '../../services/ObservableCommandService';
import CourseViewModel  from "../../view-models/CourseViewModel";
import * as _ from 'lodash';
import { WorkshopTrainingRequestViewModel, DropDownSelectionViewModel } from '../../view-models/WorkshopTrainingRequestViewModel';
import { ServerCommandStatusComponent } from "../../directives/ServerCommandStatus";
import TrainingRequestRenderer from './training-request-renderer';
import { TrainingRequestFactory } from  '../../factories/Factories';
import {Router, RouteParams} from 'angular2/router';

@Component({
    selector: 'training-request-form',
    providers: [EndPointService, ObservableCommandService],
    directives: [TrainingRequestRenderer, ServerCommandStatusComponent],
    templateUrl: '/ECAV.Admin/app/training-requests/views/create-training-request.html'
})
export class CreateTrainingRequestComponent implements OnInit { ...

import {Component, View, OnInit, Input, Output, EventEmitter} from "/node_modules/angular2/core";
import ObservableService from "../services/ObservableCommandService";

@Component({
    selector: 'server-command-status',
    events: ['result'],
    template: `<div [hidden]="!observableService.hasErrors">
        <div class="alert alert-danger">
<i class="fa-fw fa fa-times"></i>
            {{observableService.errorMessage}}
        </div>
    </div>

    <div [hidden]="!observableService.showSuccess">
        <div class="alert alert-success">
<i class="fa-fw fa fa-check"></i>
            {{observableService.successMessage}}
        </div>
    </div>
`
})
export class ServerCommandStatusComponent {
private observableService: ObservableService;
public result: EventEmitter<boolean> = new EventEmitter<boolean>();

constructor(observableService: ObservableService) {
    this.observableService = observableService;
    this.observableService.setCallBack((result) => {
        if (result) {
            this.result.emit(true);
        } else {
            this.result.emit(false);
        }
    });
}

public toggleError() {
    this.observableService.hasErrors = !this.observableService.hasErrors;
    this.observableService.errorMessage = ':*( terrible things happened';
}

    </div>
    <div class="widget col-sm-12 col-md-12 col-lg-12s">
        <div class="widget-header bigger-header">
          Header
        </div>

        <div class="widget-body">
            <div class="row">
                <div class="col-sm-1 col-md-1 col-lg-1 pull-left"></div>
                <h5 class="col-sm-5 col-md-5 col-lg-5 pull-left">

                </h5>
            </div>
            <training-request-renderer [trainingRequest]="viewModel" [courses]="courses" [locations]="locations"></training-request-renderer>
            <div class="row">
                <div class="col-sm-1 col-md-1 col-lg-1"></div>
                <div class="col-sm-1 col-md-1 col-lg-1">
                    <button type="submit" class="btn btn-default" [disabled]="formIsDone">Submit</button>
                </div>
            </div>

            <div class="row">
                <div class="col-sm-1 col-md-1 col-lg-1"></div>

                <div class="col-sm-10 col-md-10 col-lg-10">
                    <div class="form-group">
                    </div>
                    <server-command-status (result)="updateForm($event)"></server-command-status>
                </div>
            </div>

            <br />
        </div>
    </div>
</form>