지시어에 범위가 표시되지 않습니다.

Question

$ scope를 통해 내 변수에 두 개의 변수를 전달하는 컨트롤러가 있습니다. 보기에 해당 변수를 표시 할 수 있습니다.

필자는 필자가 지시어를 사용하여 지시어 범위에 두 변수를 전달한다. 여기

.directive('notes', function(){ 
    return { 
    restrict: 'E', 
    templateUrl:'views/directives/notes-tpl.html', 
    scope:{ 
     time:'=', 
     unit:'=' 
    }, 
    controller:['$scope',function($scope){ 

     console.log('Current Time Stamp: ' + $scope.time); 
     console.log('Current Unit Stamp: ' + $scope.unit); 

     }; 

    }] 
    }; 
}) 

내 HTML입니다 :

<notes time='currentTimeStamp' unit='currentUnitStamp'></notes> 

문제는 내을 console.log() 그들에게 정의되지 않은 표시이다는

여기 내 지시어이다. 귀하의 예를 들어 새로운 추측 본 후

<!-- NOTES MODAL --> 
<script type="text/ng-template" id="notesModal.html"> 
    <div class="modal-header"> 
     <a class="close" data-dismiss="modal" aria-label="Close" ng-click="close()"><span aria-hidden="true">&times;</span></a> 
     <h3 class="modal-title">Notes</h3> 
    </div> 

    <notes currentTimeStamp='{{currentTimeStamp}}' currentUnitStamp='{{currentUnitStamp}}'></notes> 

</script> 

Answer 1

:

나는 모달의 지시를 호출있어 지시어를 호출하여 HTML을의

을

<notes currentTimeStamp='{{currentTimeStamp}}' currentUnitStamp='{{currentUnitStamp}}'></notes> 

1. 그러나 귀하의 notes.js에는 이에 대한 바인딩이 없습니다.

   return { 
       ... 
       scope: { 
        currentTimeStamp="", 
        currentUnitStamp="" 
       } 
       ... 
   } 
   

2. 는이처럼 지침이 점을 통과해야 다음 current-time-stamp 대신 currentTimeStamp에

   <notes current-time-stamp='currentTimeStamp' current-unit-stamp='currentUnitStamp'></notes> 
   

   에주의를. 정규화 섹션을 확인하십시오.

https://docs.angularjs.org/guide/directive

나는 이것으로 문제를 해결할 수 있기를 바랍니다.

---

또 다른 추측 :

는 당신이 순수 JS에서 "각의에서"업데이트 할 수 없습니다. 각도는 값을 업데이트해야한다는 것을 모릅니다.

click 이벤트의 일부 값을 업데이트한다고 가정 해 보겠습니다. 이제 우리는 애플릿을 업데이트하고 호출하기 위해 ng-click을 사용하고 있습니다. 그래서 각진은 다이제스트주기를 시작하여 값을 업데이트합니다. 이처럼

: ng-click="updateTimeStamp()

이제 몇 가지 우리가 각 사용하지 않는 이유는,하지만 대한 대신 기본 이벤트 리스너 : element.addEventListener("click", updateTimeStamp);

그래서 우리는 지금 범위 및 그 값을 업데이트하려는 경우, 예를 들어 $timeout 서비스로 다이제스트주기를 시작해야합니다.다이제스트주기에 대한

추가 정보 : 검증을 위해 https://docs.angularjs.org/guide/scope

당신이 값을 설정 청취자의 말에 $timeout(angular.noop);을 넣어.

예 :

myElement.addEventListener("click", function() { 
    var newTime = takeMeFromSomewhere; 
    $scope.time = newTime; 
    // Angular doesn't know to update the binding! 
    $timeout(angular.noop); 
    // now you kicked off the digest cycle and angular will update the values 
});