패널 제목에 값 바인딩

Question

값을 패널 제목에 바인딩 할 때 문제가 있습니다.

내 코드는 기본적으로 다음과 같습니다

Ext.define('serviceteamWorkflow.view.core.ServiceteamWorkflow', { 
    extend: 'Ext.Panel', 
    bind: { 
     title: 'First Name : {firstName} Last Name : {lastName}' 
    }, 

}) 

문제는 바인딩 값 중 하나가 null 또는 정의되지 않은 경우 아무것도 제목에 표시되지 않습니다 것입니다. 예. 바운드 값 중 하나가 유효하지 않으면 모든 것이 표시되지 않습니다.

바운드 값이 유효하지 않은 경우 아무 것도 표시하지 않습니다. 예 :

이름 : 성 : 미상

이 주위에 방법이 있나요?

당신은 당신의보기 모델에 바인딩을 참조 할 것 수식 만들 수

Answer 1

: 사람들을 위해

requires: [ 
    'Ext.app.bind.Formula' 
], 

data: { 
    firstName: '', 
    lastName: 'Johnson' 
}, 

formulas: { 
    showTitle: function(get) { 
     var firstName = get('firstName'), 
      lastName = get('lastName'); 

     return "First Name : " + firstName + " Last Name: " + lastName; 
    } 
} 

Answer 2

:

Ext.define('serviceteamWorkflow.view.core.ServiceteamWorkflow', { 
extend: 'Ext.Panel', 
bind: { 
    title: {showTitle} 
}, 

}) 당신의 ServiceteamWorkflow보기 모델 내부 그리고

을 Evan Trimboli가 첫 번째 의견에서 제안한대로 viewmodel에 기본값을 설정하는 방법을 궁금한 나와 같이보기에서 설정해야합니다.

viewModel: { 
    data: { 
     firstName: '', 
     lastName: '' 
    } 
} 

당신은 예를 들어, 어딘가 동적 데이터를 설정 한 경우 :

이 같은 기본값을 설정해야

this.getViewModel().set('fullName', data); 

:

viewModel: { 
    data: { 
     fullName: { 
      firstName: '', 
      lastName: '' 
     } 
    } 
}