Angular2: декоратор Pipe не найден на компоненте

Я использую несколько довольно стандартных пользовательских каналов в своем приложении Angular 2.0-rc1. Все было хорошо, пока я не переместил трубы в новую папку. Теперь я получаю:

Как видите, я объявляю каналы в своем компоненте. Пути все в порядке. Не могу понять, как это исправить.

import { Component, AfterViewInit, Input, SimpleChange, Output, EventEmitter } from "@angular/core";
import { IPropertyRoom } from "./../../shared/propertyData";
import { FirstHalfPipe } from "./../../shared/pipes/first-half.pipe";
import { SecondHalfPipe } from "./../../shared/pipes/second-half.pipe";

export interface IRoomData {
    roomId: number;
    isFeatured: boolean;
    roomName: string;
    featurePicSrc: string;
    description: string;
    amenities: string[];
}

@Component({
    selector: "room-detail-widget",
    templateUrl: "app/mobile/roomDetailWidget/room-detail-widget.html",
    directives: [],
    pipes: [FirstHalfPipe,SecondHalfPipe]
})
export class RoomDetailWidgetComponent {
    @Input() roomDetail: IRoomData;
    @Output() onRoomTabClick = new EventEmitter();

    constructor() {

    }

    ngOnChanges(changes: { [propName: string]: SimpleChange }) {
        this.roomDetail = changes["roomDetail"].currentValue;

    }
    roomClick() {
        this.onRoomTabClick.emit(this.roomDetail.roomId);

    }

    

}

Как оказалось, это была "глупая" ошибка.


person brando    schedule 30.05.2016    source источник


Ответы (3)


Я случайно сослался на компонент-нарушитель как канал, а не директиву в родительском компоненте следующим образом:

Надеюсь, это поможет избежать головной боли для кого-то еще. Легко совершить ошибку...

import { RoomDetailWidgetComponent, IRoomData } from "./../roomDetailWidget/room-detail-widget.component"

@Component({
    directives: [],
    selector: "parent",
    templateUrl: "path/parent.html",
    pipes: [RoomDetailWidgetComponent]  //Duh, big FAIL
})
export class ParentComponent {
 

    constructor() {

    }
    
    
}

Каналы не поддерживают наследование. Это просто предположение, но я помню, что видел, что канал, который расширяет другой класс, вызывает эту ошибку. https://github.com/angular/angular/issues/8694

person brando    schedule 30.05.2016
comment
Спасибо за ответ. Я продолжаю проверять путь к трубам, и они кажутся в порядке. Но я согласен, это будет вероятным виновником. буду дальше тестить.. - person Charles; 30.07.2016

Кажется, что Angular2 может найти метаданные для канала.

person Günter Zöchbauer    schedule 30.05.2016

Когда вы добавляете декоратор Pipe, добавляется следующее.

См. этот планкр: https://plnkr.co/edit/d0gXbGm3mus1cQLE1wgB?p=preview .

[PipeMetadata]
  0: PipeMetadata
    _pure: undefined
    name: "some"
    pure: (...)
    __proto__: InjectableMetadata
  length:1
  __proto__: Array[0]

Возможно, ваш путь к модулям, содержащим каналы, неверен, поэтому ваши импортированные каналы равны нулю...

Я только что сделал то же самое ;)

person Thierry Templier    schedule 30.05.2016
comment
Как я вижу вас в plunkr, вы можете видеть использование напрямую _1_, если у вас есть соответствующие метаданные в классе канала. Если посмотреть файл _2_ (29:15), то проблема именно в нем. Не удается найти метаданные. Таким образом, либо декоратор применяется неправильно, либо то, что вы импортируете, равно нулю,... - person brando; 30.05.2016
comment
Если вы попытаетесь отобразить класс, который вы импортируете таким образом: Reflect.getMetadata. Что ты видишь? - person Thierry Templier; 30.05.2016
comment
console.log(FirstHalfPipe) никогда не попадает; ошибка возникает на этапе компиляции (если только конструктор компонента-нарушителя не находится в неправильном месте) - person Thierry Templier; 30.05.2016
comment
На самом деле это нормально, потому что ваш компонент не создается из-за ошибки конвейера. Я бы переместил _1_s сразу после импорта... - person brando; 30.05.2016
comment
zone.js:461 Отклонение необработанного обещания: декоратор Pipe не найден в RoomDetailWidgetComponent ; Зона: угловая; Задание: Promise.then ; Значение: BaseException {сообщение: «В RoomDetailWidgetComponent не найден декоратор канала», стек: «Ошибка: в RoomDetailWidget не найден декоратор канала…/@angular/compiler/src/runtime_compiler.js:66:49)»} сообщение: «Нет канала Обнаружен декоратор в стеке RoomDetailWidgetComponent: «Ошибка: декоратор Pipe не найден в RoomDetailWidgetComponent↵ в новом BaseException (http://localhost:5000/lib/@angular/compiler/src/facade/exceptions.js:17:23)↵ в PipeResolver.resolve (http://localhost:5000/lib/@angular/compiler/src/pipe_resolver.js:29:15)↵ в CompileMetadataResolver.getPipeMetadata (http://localhost:5000/lib/@angular/compiler/src/metadata_resolver.js:142:47)↵ в eval (http://localhost:5000/lib/@angular/compiler/src/metadata_resolver.js:173:57)↵ в Array.map (собственный)↵ в CompileMetadataResolver.getViewPipesMetadata (http://localhost:5000/lib/@angular/compiler/src/metadata_resolver.js:173:22)↵ в eval (http://localhost:5000/lib/@angular/compiler/src/runtime_compiler.js:80:58)↵ в Array.forEach (собственный)↵ в RuntimeCompiler._compileComponent (http://localhost:5000/lib/@angular/compiler/src/runtime_compiler.js:76:36)↵ в eval (http://localhost:5000/lib/@angular/compiler/src/runtime_compiler.js:66:49)"proto: ErrorconsoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js: 426 zone.js: 463 Ошибка: Uncaught (в обещании): в RoomDetailWidgetComponent (…) consoleError не найден декоратор Pipe @ zone.js: 463_loop_1 @ zone.js: 490drainMicroTaskQueue @ zone.js: 494ZoneTask.invoke @ зона.js: 426 - person Thierry Templier; 30.05.2016