2016-06-26 5 views
2

Aurelia의 특성을 통해 개체를 사용자 지정 구성 요소로 전달할 수 있습니까? 속성을 통해 사용자 지정 구성 요소에 개체 전달

import {bindable} from 'aurelia-framework'; 

export class PageHeading { 
    @bindable title = ''; 
    @bindable subTitle = ''; 
    @bindable path; 

    constructor() { 
     console.log('page heading...' + this.subTitle); 
    } 

    created() { 
     console.log('created.. ', this.path); 
    } 
} 

그리고 html 파일에

는이 같은 해당 구성 요소에 사용 :

내 사용자 지정 구성 요소 클래스는 다음과 같습니다

<page-heading title="Dashboard" sub-title="your starting point" path="${path}"></page-heading> 

titlesubTitle 같은 문자열을 잘 작동을하지만 구성 요소에 객체를 전달하는 방법을 모르겠습니다. 이것이 가능한가? 그렇다면 Aurelia에서 어떻게해야합니까?

<page-heading title.bind="myObject" ...></page-heading> 

또는 객체 리터럴 바인딩 표현과 관련하여 bind 명령을 사용합니다 :

답변

5

은 요소의 제목 바인딩 속성에 속성을 바인딩 bind 명령을 사용하여

<page-heading title.bind="{ foo: 'foo', bar: someProperty, baz: anotherProperty }" ...></page-heading> 

참고 : ES6 객체 리터럴의 약식 구문이 지원됩니다. foo, barbaz 소품이 VM에 있다고 가정하면이 작업은 다음과 같이 작동합니다.

<page-heading title.bind="{ foo, bar, baz }" ...></page-heading>