Home > Blockchain >  How to pass in a second input to a directive with a kebab case selector?
How to pass in a second input to a directive with a kebab case selector?

Time:11-14

Say I have a directive that has a selector of selector: '[example-directive]'. Is there a way to pass in a second input to the directive? I've been able to succeed by changing the selector to selector: '[exampleDirective]' and prefixing the input with exampleDirective, but I'm wondering if there's a way to do it in kebab case.

This is roughly what the directive looks like:

@Directive({
    selector: '[example-directive]',
})
export class ExampleDirective implements OnChanges {
    @Input('example-directive') input1: string;

    @Input() exampleDirectiveInput2: string;

I've tried to add an alias to the second input with no luck:

@Input('input2') exampleDirectiveInput2: string;

html: <div *example-directive="'value1'; input2: 'value2'"></div>

CodePudding user response:

If you would like to pass multiple parameter into the same structural directive you could wrap them into an object.

But you can also define multiple inputs, but then you need to pass it like two directives.

<div 
    example-directive="'value1'"
    input2="'value2'"
></div>

Also check out this question: enter image description here

I know I should provide more information, however, it will become a very long answer, plus, the article gives a very detailed answer already, so no need to rewrite it here.

  • Related