$ 범위 문제. HTML보기에 표시되지 않은 변경

얘들 아 내가 각도에 새로운 오전과 내가 약간의 문제에 직면하고있다 : 나는 ngJsTree를 사용하고 있는데 단순히 어떤 때를 수행하는 "selectNodeCB"방법을 무시하고 지금

을 트리에서 노드를 선택합니다. 내 컨트롤러에서 다음과 같이 보입니다.

$scope.test = "Hellow World" 
... 
function selectNodeCB(event, data) { 
     debugger; 
     $scope.test = "Goodbye World"; 

}

이제 UI에서 노드를 선택하면 디버거에서 멈 춥니 다. $ scope.test가 "Goodbye World"로 바뀌 었습니다. 메소드가 끝나면 변경 사항이 UI에 표시되지 않습니다 (HTLM 메소드).

나는 내가이 수행 할 때 때문에이 "selectNodeCB"기능의보고 없음 $ 범위 함께 할 수있는 뭔가가 생각 :

$scope.testFnc = function() { 
     $scope.test = "Goodbye World"; 
};

을하고 완벽하게 작동합니다 몇 가지 버튼을 클릭에 나는 그것을 설정합니다. 또한 "selectNodeCB"에서 "testFnc"를 호출 해 보았습니다.하지만 HTML에서는 아무 것도 변경되지 않았습니다.

누군가가 내게 팁을 줄 수 있다면 정말 기쁜 일이 될 것입니다.

출처

2016-07-12 Lazar Lazarov

좋은 PPL 내가는 HTML보기에서 문제가 있었다 answear 발견 : 이제 솔루션

  <div class="portlet-body"> 
       <div class="container" ng-controller="EditPrizeTableCtrl as vm"> 
        <div class="row" cg-busy="vm.promise"> 
         <toaster-container></toaster-container> 
         <div class="col-xs-6"> 
          <div class="panel-body"> 
           <div id="ptTree" js-tree="treeConfig" should-apply="ac()" ng-model="treeData" 
            tree="treeInstance" tree-events="ready:readyCB;select_node:selectNodeCB"></div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
      ...... 
      <div> {{test}} </div>

을이은 : {{테스트}} 컨테이너

<div class="container" ng-controller="EditPrizeTableCtrl as vm"> ... </div>

를 벗어나면

작동하지 않습니다. {{test}} 내부에 넣는 경우 :

<div class="container" ng-controller="EditPrizeTableCtrl as vm"> {{test}} ... </div>

잘 작동합니다. 그러나 이것은 일반적인 해결책이 아닙니다. 당신이 용기를 필요로하는 곳에 따라서는 변수 "VM"을 걸 수없고 그냥 "EditPrizeTableCtrl"를 사용 :

  <div class="portlet-body"> 
      <div class="container"> 
       <div class="row" cg-busy="EditPrizeTableCtrl.promise"> 
        <toaster-container></toaster-container> 
        <div class="col-xs-6"> 
         <div class="panel-body"> 
          <div id="ptTree" js-tree="treeConfig" should-apply="ac()" ng-model="treeData" 
           tree="treeInstance" tree-events="ready:readyCB;select_node:selectNodeCB"></div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
     ...... 
     <div> {{test}} </div>

완벽 작동 방법!

출처

2016-07-12 07:48:44

$ 범위 문제. HTML보기에 표시되지 않은 변경

답변

관련 문제