Bir diziyi bileşen şablonundan Input() olarak nasıl geçirebilirim?

Question

Ciltleme kullanarak bir bileşene bir dizi değer vermem gerekiyor, ör.

@Component({ 
    selector: 'my-component', 
    template: '<div data="[1, 2, 'test']"></div> 
}) 
export class MyComponent { 
    @Input() data: any[]; 
    ... 
} 

Ancak, bu string/string[1] olarak (fiili projede dizi rota ve ben [routerLink] yönergesi olan bir bileşene bu rotayı geçmesi gerekiyor) Açısal davranır gibi görünüyor.

Bunun için nasıl giderim?

Answer 1

Sen aksi takdirde Açısal hiç tarafından işlenmez [] ile mülkiyet sarmak gerekir:

[data]="[1, 2, 'test']" 

Sizin örnek bileşeni içinden data ayarlamak gibi görünüyor. Bağlamanın nasıl işlediği bu değil. Bileşeninizle neler yapabileceğiniz, verileri dışarıdan bileşene aktarmak için <my-component [data]="[1, 2, 'test']"></my-component>'dur.

Answer 2

Normal olarak, yalnızca bileşen başka bir bileşende yuvalandığında girişi kullanırsınız. Başka bir bileşende Yani

, gibi bir şey: <my-component [data]= ...>

Answer 3

So ...

en etrafta parantez alamazsanız tüm girdisi dize aşağı geçecek Eğik 2+ yılında ... buradan başlayın sağlar

Yani değerlerini aşağı geçmek 2 yolu ...

bunu böyle yazarsanız vardır: '<div data="[1, 2, 'test']"'

temelde olarak olsun "[1, 2, 'Test']"

yaptığını yolu ... (dize olarak) aşağı dizeleri geçirilmesi için iyi bir yoldur ve aynı zamanda gibi aşağı geçirmeden önce interpolasyon kullanmak ve javascript ile karıştırabilirsiniz 'Eğik {{version}}' Yani

bir Array veya hiçbiri-acı değeri, bu gibi girdi etrafında [] kullanmak gerekir javascript herhangi ...

<div [data]="[1, 2, 'test']"></div> 

olarak aşağı geçmek