2016-08-26 7 views
1

여러 TextField로 구성된 맞춤 구성 요소를 작성하려고합니다. 이 컴포넌트는 Observable을 통해 내부적으로 twoWay 데이터 바인딩을 사용해야합니다. 그러나 나는 단순히 작동시키지 못하고있다.Nativescript UI 작성기 및 데이터 바인딩

main.js

exports.loaded = function(args){ 
    var page = args.object; 
    page.bindingContext = model; 

    var outerContainer = page.getViewById('outerContainer'); 

    model.vma = new Observable({ 
     label: "NiceLabel" 
    }); 
    var vma = durationRow.init({ 
     model: model.vma 
    }); 

    outerContainer.addChild(vma); 
}; 

위젯/durationrow.js

exports.init = function(options){ 
    model = _.isUndefined(options) 
     ? model 
     : options.model; 

    _.defaults(model, { 
     label:  "no data given", 
     start:  "", 
     end:  "", 
     duration: "30" 
    }); 

    var durationRow = builder.load({ 
     path: 'widgets/durationRow', 
     name: 'durationRow', 
    }); 

    durationRow.getViewById("startText").bind({ 
     sourceProperty: "start", 
     targetProperty: "text", 
     twoWay: true }, 
    model); 

    return durationRow; 
} 

원래 start, endduration 필드 내 XML-layouted보기의 text 특성에 삽입 얻을의 데이터. 그러나 모델의 변경 사항은 초기 "렌더링"이후 UI로 전달되지 않습니다.

내 XML 및이 JS 기반 데이터 바인딩에서 text={{ start }}을 통해 XML 기반 데이터 바인딩을 시도했습니다. 둘 다 "초기 렌더링"에서만 작동하므로 업데이트가 승격되지 않습니다.

제안 사항? 감사합니다.

답변

1

좋아, 몇 가지 잘못 됐어. 내 "위젯"에 "데이터"를 가져올 수 없어서 전체 init을 만들었습니다.

main.js

var row = builder.load({ 
    path: 'widgets/durationRow', 
    name: 'durationRow', 
    attributes: { 
     bindingContext: rowData 
    } 
}); 
: 모든 후 모두 간단한 작은 오류에 따라 발생 ... 난 ... 대신 bindingContext 모든 지옥의 bindContext를 사용

따라서 작업 솔루션을 시도

그리고 이제는 durationRow.js에 다른 것이 필요하지 않습니다. rowData에 대한 모든 JS 액세스는 bindingContext를 통해 이루어지며 모든 것이 매력처럼 작동합니다.