AngularJS - 로컬 지시문 및 부모 범위

Question

지시문 작성을 시작하고 있으며 지시문의 '격리'범위를 정의하는 전체 개념을 이해하고 있습니다.

지시문 numberRoulette은 제공된 숫자에 임의의 숫자로 각 자릿수 (또는 속성 fields="some-number-here"을 통해 제공된 자릿수)에 애니메이션을 적용해야합니다. 경과 된 초마다 한 자리 숫자가 애니메이션을 멈추고 의도 한 숫자로 설정됩니다. 슬롯 머신처럼 그것은 비트 ..

<div ng-app="myApp"> 
    <div ng-controller="MasterCtrl"> 
    <span number-roulette fields="10" ng-model="number"> 
     {{number}} 
    </span> 
    </div> 
</div> 

내가 실행 해요 문제는 내가 두 방법은 지침의 범위와 컨트롤러 MasterCtrl 사용하는 범위 사이의 바인딩 할 때, 내 값을 중지하는 것이있다 표시.

app.directive('numberRoulette', function($timeout) { 
    return { 
    restrict: 'A', 
    scope: {showNumber: '=ngModel'}, 
    ... 
    }; 
}); 

function MasterCtrl($scope) { 
    $scope.number = 1000; 
} 

JSFiddle : http://jsfiddle.net/nguyening/aX6Zm/3/

Answer 1

사용 {{showNumber}} 또는 스팬 외부 {{number}} 이동합니다.

지시문에 분리 범위가 작성되었으므로 범위 내에서 지시선 범위 속성에만 액세스 할 수 있습니다 (예 : showNumber).

스팬 외부에서는 컨트롤러 범위 속성에 액세스 할 수 있습니다 (예 : number).

업데이트 : 여기서 ng-model은 필요하지 않습니다. 모든 속성은 그 다음 지시어에 :,

<span number-roulette fields="10" model="number"> 

을 예컨대을 수행합니다

scope: {showNumber: '=model'},