2016-07-26 2 views
0

제 문제는 폴리머 구성 요소가 제 행동에 정의 된 변수에 바인딩 된 데이터로 보이지 않는다는 것입니다. 이것이 지원되지 않거나 내 결함있는 생각이 무엇인지 알고 싶습니다.폴리머 - 행동에서 변수에 데이터 바인딩

내가 공유 한 동작을 사용하는 사용자들에게 글로벌 상태의 일종으로 사용되는 내 행동 변수 :

<script> 
var StackOverflowBehavior = { 
    properties: { 
     show: { 
      type: Boolean, 
      value: false, 
      notify: true 
     } 
    }, 
    attached: function() { 

     $.ajax({ 
      type: 'GET', 
      url: 'http://myRestApiURL', 
      success: this.onRequestSucceed, 
      error: this.onRequestFailed 
     }); 
    }, 

    onRequestSucceed: function(response) { 
     this.show = true; // i hardcoded this at the moment to make sure it changes. console logging shows that the variable is getting changed. also tried changing this to this.show 
    } 

지금은 행동에 내 폴리머 성분 훅 :

<template is="dom-if" if="{{show}}"> 
    <!-- SOME ELEMENTS HERE --> 
</template> 

Polymer({ 
    is: "my-polymer-component", 
    behaviors: [ 
     StackOverflowBehavior 
    ], 

을 문제는 처음에는 show 변수에 바인딩 된 템플릿이 초기 StackOverflowBehavior.show에 바인딩되어 있으므로 템플릿이 보이지 않지만 show가 true 일 때 템플릿이 나타나지 않는다는 것입니다. 비슷하게, StackOverflowBehavior에서 show = true를 초기화하면 표시가 시작되지만 show = false로 설정하면 예상대로 템플릿이 사라지지 않습니다.

철자 신호를 사용하여 쇼 변수가 변경되었음을 알리는 해결 방법이 있습니다. 그런 다음 각 폴리머 구성 요소에는 신호를 수신 할 때 새 쇼 변수로 설정된 로컬 쇼 변수가 있습니다. 각 폴리머 구성 요소의 템플릿은 로컬 변수에 바인딩됩니다. 이것은 효과가 있습니다. 그러나 행동에서 공유 변수에 바인드 될 때 작동하지 않습니다.

편집 : 첨부 된 함수에서 변수를 변경하면 공유 전역 동작에 대한 데이터 바인딩이 작동하지만 사용자 정의 함수에서 변수를 변경하는 것처럼 보입니다. 데이터 바인딩 된 템플릿이있는 폴리머 구성 요소에서 ready() 메서드 내에서 console.log (show)를 호출하고 올바른 값을 출력하도록 할 수 있습니다.

도움을 주시면 대단히 감사하겠습니다.

+0

이 JS Bin은 코드와 비슷합니까? http://jsbin.com/totoma/edit?html,js,output –

+0

@TomaszPluskiewicz 비슷하지만 Behavior는 ready()에서 Ajax 호출을 가지고 있으며 콜백을 처리하는 메소드는 행동. – jbu

+0

'show' 대신'this.show'의 값을 변경하고'attached'와'onRequestSucceed'가'properties' 객체 밖에 있는지 확인하십시오. – a1626

답변

0

sigh ... 실제 코드는 json 응답을 아약스로 가져오고 부울로 변환하려고 시도하지만 실제로는 문자열 (이 작업은 내 API가 아님)이므로 데이터가 망가지는 변환 오류가 발생합니다. 제본.

관련 문제