2016-11-29 3 views
1

viewmodel에서 UI에 대한 계산 된 속성 업데이트를 강제로 업데이트하려고합니다. 그러나 초기 값은 더 이상 값을 얻지 못합니다. 그것이 함수가 아니기 때문에 속성을 변경하는 것은 실패합니다. this.refreshProcessDetails에서 this.processName.valueHasMutated을()()를 호출 할 때트리거 계산 된 속성 업데이트

declare var processViewModel: Process.ProcessViewModel; 

window.onload =() => { 
    processViewModel = new Process.ProcessViewModel(); 
    processViewModel.setBindings(); 
    ko.applyBindings(processViewModel); 
} 

나는 다음과 같은 오류가 바인딩

사이트

<script src="../../libraries/knockout-3.4.1.js"></script> 
<input id="nameInput" data-bind="value: processName" type="text"/> 
<input id="nodetotalInput" data-bind="value: processNodeCount" type="text"/> 

보기 모델

export class ProcessViewModel { 
    public processName: KnockoutObservable<string>; 
    public processNodeCount: KnockoutObservable<number>; 

    constructor() { 
     try { 
      this.testService = new Test.TestService(); 

      this.setBindings(); 
     } 
     catch (e) { 
      console.log(e); 
     } 
    } 

    public setBindings(): void { 
     this.processName = ko.computed<string>(
      function() { processViewModel.isLoaded() ? processViewModel.testService.flowModel.process.name : ""; } 
     ); 
     this.processNodeCount = ko.computed<number>(
      function() { processViewModel.isLoaded() ? processViewModel.testModel.nodeCount() : 0; } 
     ); 
    } 

    public isLoaded(): boolean { 
     return this.testService.isLoaded(); 
    } 

    public refreshProcessDetails() { 
     try { 
      let message: string = "IsLoaded" + this.isLoaded(); 
      console.log(message); 

      /** attempts at triggering an update */ 
      this.processName(); 
      this.processName.valueHasMutated(); // fails because it's not a function 

      this.processNodeCount(); 
     } 
     catch (e) { 
      console.log(e); 
     } 
    } 
} 

;

스택 : "형식 오류가 : this.processName.valueHasMutated이

+1

'TestService'는 구독 할 수있는 이벤트를 제공하지 않습니까? "로드"이벤트를 듣는 것은 녹아웃의 전적으로 이벤트 중심 접근 방식에 훨씬 더 적합합니다. 'refreshProcessDetails'와 같은 폴링 함수를 만들면 이상적인 결과가 발생합니다. – Tomalak

답변

3

valueHasMutated에서 함수 \ n을하지 않습니다 만 정상 관찰 가능한 가지고하는 방법입니다 계산 된의 관찰 가능한이 방법이없는 즉 '때문에 주로 valueHasMutated 아무튼입니다.. 당신이 생각하는대로해라. 관측 대상에서 업데이트를 유발하지 않고 대신 구독 관측 대상에서 다운 스트림 업데이트를 트리거하므로 여기서는 도움이되지 않는다.이 경우, HTML 바인딩에 업데이트를 지시하지만 processName 값을 변경하지 않으므로 바인딩에서 아무 것도하지 않습니다.

일반적으로 w 에 의존하는 관측 값을 변경하는 것 이외에 계산 된 관측 가능성에 대한 업데이트를 트리거합니다. 대신, 관찰 할 수있는 컴퓨터는 어딘가에 다른 관찰 가능한 곳 (선호)에 의존해야합니다. 그렇지 않으면 수동으로 관찰 대상에 직접 작성해야합니다. (즉이 변경되는 않다면, 등을 ​​예를 들어, 프로세스 이름 또는 프로세스 자체)를 할 때 자동으로 업데이트됩니다 계산하도록

  1. 당신이, 관찰 변화 processViewModel.testService.flowModel.process.name의 일부를 만들 수있는 경우 : 그렇게하려면 그렇습니다.
  2. 또는 계산 된 값이 없습니다. processName 및 processNodeCount는 정상적인 관찰 가능 상태로두고 refreshProcessDetails를 호출 할 때 올바른 값을 작성하십시오.

전체적으로 데이터 모델을 자동으로 유지하는 계산이 있습니다. 처음부터 끝까지 관측 가능을 사용하거나 직접 관측 할 수 있도록 수동으로 업데이트해야합니다. 중간에있을 수는 없습니다.

옵션 2를 사용하면 녹아웃의 가치가 많이 상실된다는 점에 유의하십시오. 녹아웃을 수행하는 '올바른 방법'은 응용 프로그램의 큰 섹션 (이 필드와 여기에 의존하는 모델의 필드)을 관찰 가능한 상태로 유지하여 모든 것이 마술처럼 작동하도록하는 것입니다. Knockout을 사용하는 코드 부분이 클수록 더 잘 작동합니다. 축소하면 Knockout이 오히려 수동 작업을하는 것을 의미합니다.

+0

고마워, 나는 생각해야 해. 옵션 2가 선호 될 것이지만 DTO 모델에서 속성이 나오기 때문에 몇 가지 변경 사항이 필요합니다. – wonea

관련 문제