2017-02-07 4 views
1

Я ищу, чтобы увидеть, можно ли взять строку, которая представляет имя углового трубопровода и разрешить его в шаблоне. Например:Angular2: Resolve string to the pipe

//Component: 
pipe = 'date' 

//Template 
{{ pipe? (somevalue | pipe) : (somevalue) }} 

В приведенном выше примере, есть способ, который можно разрешить строку фактической трубы, которые могут быть использованы в шаблоне. Есть ли лучший способ применить трубу динамически?

В данном случае пользователь может указать, какой формат использовать для значения, если таковой имеется.

Update

Законченное происходит с пользовательской трубой, которая принимает имя канала для выполнения в виде строки, а также любых других возможных форматов для него. Вот фрагмент, где труба может быть «дата» и формат может быть «MM/DD/YYYY»:

{{ somevalue | applypipe: pipe: format }}

Я бы затем использовать какую-то отображение/завод для принятого имени канала, создать а затем запустить его метод преобразования.

Спасибо за идеи!

+0

Почему бы не построить собственный трубопровод, который получает услугу впрыскивается. Эта служба может предоставить метод для изменения метода преобразования на основе выбора/формата ваших пользователей. – maffelbaffel

+0

Итак, вы думаете, что значение будет передано через пользовательский канал, а пользовательский канал вернет значение на основе входных конфигураций или конфигурации службы: {{somevalue | custompipe: pipe}}, а затем настраиваемый канал пытается сопоставить строку с фактическим каналом, объявить его, преобразовать значение и вернуть его. Правильно ли я понимаю? – lupus137

+0

Да, кажется, вам нужна фабрика, чтобы правильно разрешить вашу трубку. Синхронизация динамических компонентов не работает должным образом, поэтому также ожидайте создания динамических потоков. – VadimB

ответ

0

Может быть, это может помочь, чтобы получить представление ..

@Pipe({ 
    name: 'anyPipe' 
}) 
export class AnyPipe { 
    public transform(val: any, arg: any) { 
    return '!!' + val; 
    } 
} 

@Pipe({ 
    name: 'dynPipe' 
}) 
export class DynamicPipe { 
    public transform(val: any, pipe: any) { 
    if (!pipe) return val; 

    switch (pipe) { 
     case 'p1': return val + '-p1'; 
     case 'p2': { 
     return new AnyPipe().transform(val, 'some args', 'maybe', '..'); 
     } 
     case 'p3': return val + '-p3'; 
     default: return val; 
    } 
    } 
} 

живой демо: https://plnkr.co/edit/V64fok5eFeHAHz8DB6DJ?p=preview