C# Windows 런타임 구성 요소 클래스 WinJS 바인딩

Question

WinJS View 코드와 Windows 런타임 구성 요소 ViewModel 코드간에 데이터 바인딩이 작동하지 않는 것 같습니다. 이 사이트에 대한 제안이나 조언

저는 Xaml/C# 배경에서 왔지만 내 UI (일명보기) HTML/WinJS를 만들 필요가 있습니다. 그래서 HTML/WinJS를 Xaml + C# - 코드 숨김과 비슷한보기로 취급합니다. 그러나 나는 C# 코드를 사용하여 다른 모든 것을 작성하고 싶습니다. 따라서 Windows 런타임 구성 요소 프로젝트에서 내 ViewModels를 만들고 WinJS에서 ViewModel 인스턴스를 나타내는 로컬 변수를 설정합니다. 그러나 ViewModel에서 간단한 문자열 속성에 바인딩하려고하면 다음과 같은 JavaScript 예외가 발생합니다.

ms- appx : //의 8652 행 17 열에서 JavaScript 라이브러리 코드에서 예외가 걸릴 예정입니다 microsoft.winjs.1.0/JS/base.js 는 0x800a13d5 - 자바 스크립트 런타임 오류 : 속성을 정의 할 수 없습니다 '_getObservable', 라인 base.js : 객체가 파일 확장되지 않습니다 8652, 칼럼 : 여기에 17

은이다 ViewModel 인스턴스를 가져 와서 바인딩을 처리하는 내 home.js 파일의 코드 :

(function() { 
    "use strict"; 

    var _viewModel; 

    WinJS.UI.Pages.define("/pages/home/home.html", { 
     // This function is called whenever a user navigates to this page. It 
     // populates the page elements with the app's data. 
     ready: function (element, options) { 
      // TODO: Initialize the page here. 
      _viewModel = ViewModels.ViewModelLocator.viewModelTest; 

      WinJS.Namespace.define("Application.Pages.Home", { "ViewModel": _viewModel }); 
      WinJS.Binding.processAll(null, Application.Pages.Home.ViewModel); 
     } 
    }); 
})(); 

<section aria-label="Main content" role="main" data-win-bindsource="Application.Pages.Home"> 
     <h2 data-win-bind="innerText: ViewModel.testString"></h2> 
     <h3>Test String Property: <span data-win-bind="innerText: testString"></span></h3> 
     <button id="changeTestStringButton">Change testString value</button> 
</section> 

Answer 1

WinJS에서 바인딩 할 수있는 유일한 개체/속성은 WinJS API를 사용하는 등 관찰 가능한 표시됩니다 것들이다 : 10 그리고 여기에는 데이터 - 윈 ​​- 바인딩 속성을 가진 간단한 home.html을 코드입니다. 이는 INotifyPropertyChanged를 구현해야한다는 점에서 XAML/C#에서 데이터 바인딩이 작동하는 방식과 유사합니다.

작성한 WinRT 객체가 봉인되었으므로 이해가 끝나는 한 원하는 컨텍스트에서 관찰 가능하게 만들 수 있도록 확장 할 수 없습니다.

과거에이 작업을 수행 한 방식은 필요에 따라 WinRT 유형을 변환하는 자바 스크립트 래퍼 클래스를 만드는 것입니다 (우리를 위해 관리 코드에서 데이터 서비스 호출하기).