질문자 :Pashec
AngularJS 프레임워크에서 데이터 바인딩은 어떻게 작동합니까?
나는 그들의 사이트 에서 기술적 세부사항을 찾지 못했습니다. 데이터가 보기에서 모델로 전파될 때 작동 방식은 다소 명확합니다. 그러나 AngularJS는 setter와 getter 없이 모델 속성의 변경 사항을 어떻게 추적합니까?
이 작업을 수행할 수 있는 JavaScript 감시자가 있다는 것을 발견했습니다. 그러나 Internet Explorer 6 및 Internet Explorer 7 에서는 지원되지 않습니다. 그렇다면 AngularJS는 예를 들어 다음과 같이 변경하고 이 변경 사항을 뷰에 반영했음을 어떻게 알 수 있습니까?
myobject.myproperty="new value";AngularJS는 값을 기억하고 이전 값과 비교합니다. 이것은 기본적인 더티 검사입니다. 값이 변경되면 변경 이벤트가 발생합니다.
비 AngularJS 세계에서 AngularJS 세계로 전환할 때 호출하는 $apply() $digest() 호출합니다. 다이제스트는 단순히 오래된 더티 검사입니다. 모든 브라우저에서 작동하며 완전히 예측 가능합니다.
더티 검사(AngularJS)와 변경 리스너( KnockoutJS 및 Backbone.js )를 대조하려면: 더티 검사가 간단하고 심지어 비효율적으로 보일 수 있지만(나중에 다룰 것입니다), 의미론적으로 항상 정확합니다. 반면 변경 리스너에는 이상한 코너 케이스가 많이 있으며 더 의미론적으로 정확하려면 종속성 추적과 같은 것이 필요합니다. KnockoutJS 종속성 추적은 AngularJS에 없는 문제에 대한 영리한 기능입니다.
더티 검사가 비효율적이기 때문에 우리가 느린 것처럼 보일 수 있습니다. 여기서 우리는 이론적인 주장을 하기보다는 실수를 살펴봐야 합니다. 하지만 먼저 몇 가지 제약 조건을 정의해 보겠습니다.
인간은 다음과 같습니다.
느림 - 50ms보다 빠른 것은 인간이 감지할 수 없으므로 "즉각적"으로 간주될 수 있습니다.
제한적 — 한 페이지에 사람에게 약 2000개 이상의 정보를 표시할 수 없습니다. 그 이상은 정말 나쁜 UI이고 인간은 어쨌든 이것을 처리할 수 없습니다.
그래서 진짜 질문은 이것입니다. 브라우저에서 50ms 동안 얼마나 많은 비교를 할 수 있습니까? 이것은 많은 요인이 작용하기 때문에 대답하기 어려운 질문이지만 여기에 테스트 케이스가 있습니다. http://jsperf.com/angularjs-digest/6 10,000명의 관찰자를 생성합니다. 최신 브라우저에서는 6ms 미만이 소요됩니다. Internet Explorer 8 에서는 약 40ms가 걸립니다. 보시다시피, 이것은 요즘 느린 브라우저에서도 문제가되지 않습니다. 주의 사항이 있습니다. 시간 제한에 맞추기 위해서는 비교가 간단해야 합니다... 불행히도 AngularJS에 느린 비교를 추가하는 것은 너무 쉽기 때문에 자신이 무엇을 하는지 모를 때 느린 응용 프로그램을 쉽게 구축할 수 있습니다. 하고있다. 그러나 우리는 느린 비교가 무엇인지 보여줄 계측 모듈을 제공하여 답을 얻기를 바랍니다.
비디오 게임과 GPU는 특히 일관성이 있기 때문에 더티 검사 접근 방식을 사용하는 것으로 나타났습니다. 모니터 재생 빈도(일반적으로 50-60Hz 또는 16.6-20ms마다)를 초과하는 한, 그 이상의 성능은 낭비이므로 FPS를 높이는 것보다 더 많은 것을 그리는 것이 좋습니다.
Misko는 이미 데이터 바인딩의 작동 방식에 대해 훌륭하게 설명했지만 데이터 바인딩의 성능 문제에 대한 제 견해를 추가하고 싶습니다.
Misko가 말했듯이 약 2000개의 바인딩에서 문제가 보이기 시작하지만 어쨌든 한 페이지에 2000개 이상의 정보가 있어서는 안 됩니다. 이것은 사실일 수 있지만 모든 데이터 바인딩이 사용자에게 표시되는 것은 아닙니다. 양방향 바인딩으로 모든 종류의 위젯이나 데이터 그리드를 구축하기 시작하면 나쁜 UX 없이도 2000개의 바인딩을 쉽게 달성할 수 있습니다.
예를 들어 텍스트를 입력하여 사용 가능한 옵션을 필터링할 수 있는 콤보 상자를 생각해 보십시오. 이러한 종류의 제어는 ~150개 항목을 가질 수 있으며 여전히 매우 유용합니다. 추가 기능이 있는 경우(예: 현재 선택한 옵션의 특정 클래스) 옵션당 3-5개의 바인딩을 가져오기 시작합니다. 이 위젯 중 세 개를 페이지에 배치하면(예: 국가를 선택하는 하나, 해당 국가의 도시를 선택하는 다른 하나, 호텔을 선택하는 데 세 번째) 이미 1000에서 2000 바인딩 사이에 있습니다.
또는 기업 웹 애플리케이션의 데이터 그리드를 고려하십시오. 페이지당 50개의 행은 비합리적이지 않으며 각 행에는 10-20개의 열이 있을 수 있습니다. ng-repeats로 이것을 빌드하고 일부 바인딩을 사용하는 일부 셀에 정보가 있는 경우 이 그리드만으로 2000개 바인딩에 접근할 수 있습니다.
AngularJS로 작업할 때 이것이 큰 문제라는 것을 알게 되었고 지금까지 내가 찾을 수 있었던 유일한 해결책은 ngOnce를 사용하는 대신 감시자 및 유사한 트릭을 등록 취소하거나 구성하는 대신 양방향 바인딩을 사용하지 않고 위젯을 구성하는 것입니다. jQuery 및 DOM 조작으로 DOM을 빌드하는 지시문. 나는 이것이 처음에 Angular를 사용하는 목적을 무효화한다고 생각합니다.
이 문제를 처리하는 다른 방법에 대한 제안을 듣고 싶지만 내 질문을 작성해야 할 수도 있습니다. 댓글로 남기고 싶었는데 너무 길어져서...
TL;DR
데이터 바인딩은 복잡한 페이지에서 성능 문제를 일으킬 수 있습니다.
$scope 개체를 더티 검사하여 Angular는 $scope array 을 유지합니다. $scope 를 검사하면 $$watchers 라는 array 이 포함되어 있음을 알 수 있습니다.
각 감시자는 무엇보다도 다음을 포함 object
attribute 이름이거나 더 복잡한 것일 수 있습니다.$scope 를 더티로 표시합니다.AngularJS에서 감시자를 정의하는 방법에는 여러 가지가 있습니다.
$scope 의 attribute 을 명시적으로 $watch 할 수 있습니다.
$scope.$watch('person.username', validateUnique); {{}} 보간을 배치할 수 있습니다 $scope 에 감시자가 생성됨).
<p>username: {{person.username}}</p> 감시자를 정의하기 위해 ng-model 과 같은 지시문을 요청할 수 있습니다.
<input ng-model="person.username" />$digest 주기는 모든 감시자를 마지막 값과 비교하여 확인합니다.일반 채널(ng-model, ng-repeat 등)을 통해 AngularJS와 상호 작용할 때 지시문에 의해 다이제스트 주기가 트리거됩니다.
다이제스트 사이클은 $scope 와 모든 자식에 대한 깊이 우선 탐색입니다 . 각 $scope object 에 대해 $$watchers array 반복하고 모든 표현식을 평가합니다. 새 표현식 값이 마지막으로 알려진 값과 다른 경우 감시자의 함수가 호출됩니다. 이 함수는 DOM의 일부를 다시 컴파일하고, $scope AJAX request 트리거하고, 필요한 모든 작업을 수행할 수 있습니다.
모든 범위를 순회하고 모든 조사식을 마지막 값에 대해 평가 및 확인합니다.
$scope 가 더럽습니다. 감시자가 트리거되면 앱은 무언가가 변경되었음을 알고 $scope 가 더티로 표시됩니다.
$scope 또는 상위 $scope 다른 속성을 변경할 수 있습니다. 하나의 $watcher $scope 가 여전히 깨끗하다는 것을 보장할 수 없으므로 전체 다이제스트 주기를 다시 실행합니다.
AngularJS에는 양방향 바인딩이 있으므로 데이터를 $scope 트리 위로 다시 전달할 수 있기 때문입니다. 이미 요약된 $scope 의 값을 변경할 수 있습니다. $rootScope 의 값을 변경할 것입니다.
$digest 가 더티이면 전체 $digest 주기를 다시 실행합니다. 다이제스트 사이클이 정리되거나(모든 $watch 표현식은 이전 사이클에서와 동일한 값을 가짐) 다이제스트 한계에 도달할 $digest 사이클을 계속 반복합니다. 기본적으로 이 제한은 10으로 설정됩니다.
다이제스트 제한에 도달하면 AngularJS는 콘솔에서 오류를 발생시킵니다.
10 $digest() iterations reached. Aborting! 보시다시피 AngularJS 앱에서 무언가가 변경될 때마다 AngularJS는 $scope 계층 구조의 모든 단일 감시자를 확인하여 응답 방법을 확인합니다. 개발자에게 이것은 엄청난 생산성 혜택입니다. 이제 배선 코드를 거의 작성하지 않아도 되므로 AngularJS는 값이 변경된 경우에만 알아차리고 앱의 나머지 부분을 변경 사항과 일관되게 만듭니다.
기계의 관점에서 볼 때 이것은 매우 비효율적이며 너무 많은 감시자를 만들면 앱 속도가 느려집니다. Misko는 이전 브라우저에서 앱이 느리게 느껴지기 전에 약 4000명의 관찰자를 인용했습니다.
예를 들어 큰 JSON array ng-repeat 하면 이 제한에 쉽게 도달할 수 있습니다. 감시자를 만들지 않고 템플릿을 컴파일하는 일회성 바인딩과 같은 기능을 사용하여 이를 완화할 수 있습니다.
사용자가 앱과 상호 작용할 때마다 앱의 모든 단일 감시자는 적어도 한 번 평가됩니다. AngularJS 앱 최적화의 큰 부분은 $scope 트리의 감시자 수를 줄이는 것입니다. 이를 수행하는 한 가지 쉬운 방법은 한 번 바인딩을 사용하는 것 입니다.
거의 변경되지 않는 데이터가 있는 경우 다음과 같이 :: 구문을 사용하여 한 번만 바인딩할 수 있습니다.
<p>{{::person.username}}</p>또는
<p ng-bind="::person.username"></p> 바인딩은 포함하는 템플릿이 렌더링되고 데이터가 $scope 로드될 때만 트리거됩니다.
이것은 많은 항목 ng-repeat 가 있을 때 특히 중요합니다.
<div ng-repeat="person in people track by username"> {{::person.username}} </div>이것이 저의 기본적인 이해입니다. 틀릴 수도 있습니다!
$watch 메서드에 함수(관찰할 항목 반환)를 전달하여 감시합니다.$apply 메서드로 래핑된 코드 블록 내에서 이루어져야 합니다.$apply 가 끝나면 $digest 메소드가 호출되어 각 시계를 통과하고 $digest 가 마지막으로 실행된 이후 변경되었는지 확인합니다. 일반적인 개발에서 HTML의 데이터 바인딩 구문은 AngularJS 컴파일러에게 시계를 생성하도록 지시하고 컨트롤러 메서드는 이미 $apply 따라서 애플리케이션 개발자에게는 모든 것이 투명합니다.
나는 잠시 동안 이것을 스스로 궁금해했다. setter가 없으면 AngularJS $scope 객체의 변경 사항을 어떻게 알아차릴까요? 그것은 그들을 투표합니까?
실제로 하는 일은 다음과 같습니다. 모델을 수정하는 "일반" 위치는 이미 AngularJS 의 내장에서 호출되었으므로 코드가 실행된 후 $apply 컨트롤러에 일부 요소 ng-click 하는 데 연결된 메서드가 있다고 가정해 보겠습니다. AngularJS 는 해당 메서드 호출을 함께 연결하므로 적절한 위치에서 $apply 마찬가지로 뷰에 바로 나타나는 표현식의 경우 AngularJS 의해 실행되므로 $apply 합니다.
AngularJS 외부의 코드에 대해 수동으로 $apply 를 호출해야 하는 것에 대해 이야기할 때 그것은 실행될 때 호출 스택의 AngularJS 자체에서 유래하지 않는 코드에 대해 이야기하고 있습니다.
그림으로 설명:
범위의 참조가 템플릿의 참조와 정확히 일치하지 않습니다. 두 객체를 데이터 바인딩할 때 첫 번째 객체를 수신하고 다른 객체를 수정하는 세 번째 객체가 필요합니다.
<input> 을 수정할 때 data-ref3 을 터치합니다. 그리고 고전적인 데이터 바인딩 메커니즘은 data-ref4 를 변경할 것입니다. 그렇다면 다른 {{data}} 표현식은 어떻게 움직일까요?
Angular는 모든 바인딩 oldValue 와 newValue 를 유지합니다. 그리고 모든 Angular 이벤트 후에 유명한 $digest() 루프가 WatchList를 확인하여 변경된 사항이 있는지 확인합니다. 이러한 Angular 이벤트 는 ng-click , ng-change , $http completed ... $digest() oldValue newValue 와 다른 한 반복됩니다.
이전 그림에서 data-ref1과 data-ref2가 변경된 것을 알 수 있습니다.
계란과 닭고기와 약간 비슷합니다. 누가 시작하는지 알 수 없지만 대부분의 경우 예상대로 작동하기를 바랍니다.
다른 점은 단순 바인딩이 메모리와 CPU에 미치는 영향을 쉽게 이해할 수 있다는 것입니다. 데스크톱이 이를 처리할 만큼 충분히 뚱뚱하기를 바랍니다. 휴대폰은 그렇게 강하지 않습니다.
Scope 연결된 개체에 변경 사항이 있는지 여부를 주기적으로 확인하지 않습니다. 범위에 연결된 모든 개체가 감시되는 것은 아닙니다. Scope는 프로토타입으로 $$watchers를 유지합니다. Scope $digest 가 호출될 때만 $$watchers 반복합니다.
Angular는 각각의 $$watchers에 감시자를 추가합니다.
- {{expression}} — 템플릿에서(그리고 표현식이 있는 다른 모든 곳) 또는 ng-model을 정의할 때.
- $scope.$watch('expression/function') — JavaScript에서 관찰할 각도에 대한 범위 객체를 첨부할 수 있습니다.
$watch 함수는 세 가지 매개변수를 받습니다:
첫 번째는 객체를 반환하거나 표현식을 추가할 수 있는 감시자 함수입니다.
두 번째는 객체에 변경 사항이 있을 때 호출되는 리스너 함수입니다. DOM 변경과 같은 모든 것이 이 함수에서 구현됩니다.
세 번째는 부울을 취하는 선택적 매개변수입니다. true 이면 angular deep은 객체를 감시하고 false Angular는 객체를 감시하는 참조를 수행합니다. $watch의 대략적인 구현은 다음과 같습니다.
Scope.prototype.$watch = function(watchFn, listenerFn) { var watcher = { watchFn: watchFn, listenerFn: listenerFn || function() { }, last: initWatchVal // initWatchVal is typically undefined }; this.$$watchers.push(watcher); // pushing the Watcher Object to Watchers };Angular에는 Digest Cycle이라는 흥미로운 것이 있습니다. $digest 주기는 $scope.$digest() 호출의 결과로 시작됩니다. ng-click 지시문을 통해 핸들러 함수에서 $scope 모델을 변경한다고 가정합니다. 이 경우 AngularJS는 $digest()를 호출하여 $digest 주기를 자동으로 트리거합니다. ng-click 외에도 모델을 변경할 수 있는 몇 가지 다른 기본 제공 지시문/서비스가 있습니다(예: ng-model, $timeout 등). $digest 주기를 자동으로 트리거합니다. $digest의 대략적인 구현은 다음과 같습니다.
Scope.prototype.$digest = function() { var dirty; do { dirty = this.$$digestOnce(); } while (dirty); } Scope.prototype.$$digestOnce = function() { var self = this; var newValue, oldValue, dirty; _.forEach(this.$$watchers, function(watcher) { newValue = watcher.watchFn(self); oldValue = watcher.last; // It just remembers the last value for dirty checking if (newValue !== oldValue) { //Dirty checking of References // For Deep checking the object , code of Value // based checking of Object should be implemented here watcher.last = newValue; watcher.listenerFn(newValue, (oldValue === initWatchVal ? newValue : oldValue), self); dirty = true; } }); return dirty; };JavaScript의 setTimeout() 함수를 사용하여 범위 모델을 업데이트하면 Angular는 사용자가 변경할 수 있는 내용을 알 수 없습니다. 이 경우 $digest 주기를 트리거하는 $apply()를 수동으로 호출하는 것은 우리의 책임입니다. 마찬가지로, DOM 이벤트 리스너를 설정하고 핸들러 함수 내에서 일부 모델을 변경하는 지시문이 있는 경우 변경 사항이 적용되도록 $apply()를 호출해야 합니다. $apply의 큰 아이디어는 Angular를 인식하지 못하는 일부 코드를 실행할 수 있다는 것입니다. 이 코드는 여전히 범위의 내용을 변경할 수 있습니다. 해당 코드를 $apply로 래핑하면 $digest() 호출을 처리합니다. $apply()의 대략적인 구현.
Scope.prototype.$apply = function(expr) { try { return this.$eval(expr); //Evaluating code in the context of Scope } finally { this.$digest(); } };AngularJS는 $watch() , $digest() 및 $apply() 의 세 가지 강력한 기능을 사용하여 데이터 바인딩 메커니즘을 처리합니다. 대부분의 경우 AngularJS는 $scope.$watch() 및 $scope.$digest()를 호출하지만 경우에 따라 이러한 함수를 수동으로 호출하여 새 값으로 업데이트해야 할 수도 있습니다.
$watch() :-
이 함수는 $scope에서 변수의 변경 사항을 관찰하는 데 사용됩니다. 표현식, 리스너 및 같음 객체의 세 가지 매개변수를 허용합니다. 여기서 리스너 및 같음 객체는 선택적 매개변수입니다.
$digest() -
이 함수는 $scope 개체의 모든 시계와 해당 자식 $scope 개체를 반복합니다.
(있는 경우). $digest()가 시계를 반복할 때 표현식의 값이 변경되었는지 확인합니다. 값이 변경되면 AngularJS는 새 값과 이전 값으로 리스너를 호출합니다. $digest() 함수는 AngularJS가 필요하다고 생각할 때마다 호출됩니다. 예를 들어 버튼 클릭 후 또는 AJAX 호출 후. AngularJS가 $digest() 함수를 호출하지 않는 경우가 있을 수 있습니다. 이 경우 직접 호출해야 합니다.
$apply() -
Angular는 AngularJS 컨텍스트 내에 있는 모델 변경 사항만 자동으로 업데이트합니다. Angular 컨텍스트 외부의 모델(예: 브라우저 DOM 이벤트, setTimeout, XHR 또는 타사 라이브러리)을 변경할 때 $apply()를 수동으로 호출하여 Angular에 변경 사항을 알려야 합니다. $apply() 함수 호출이 완료되면 AngularJS가 내부적으로 $digest()를 호출하므로 모든 데이터 바인딩이 업데이트됩니다.
사람의 데이터 모델을 양식과 연결해야 하는 경우가 생겨서 데이터를 양식과 직접 매핑했습니다.
예를 들어 모델에 다음과 같은 항목이 있는 경우:
$scope.model.people.name형식의 제어 입력:
<input type="text" name="namePeople" model="model.people.name">그렇게 하면 개체 컨트롤러의 값을 수정하면 뷰에 자동으로 반영됩니다.
내가 전달한 모델이 서버 데이터에서 업데이트되는 예는 작성된 로드를 기반으로 우편 번호 및 우편 번호를 요청하고 해당 보기와 관련된 식민지 및 도시 목록을 기본적으로 사용자와 함께 설정하는 경우입니다. 그리고 이것은 내가 아주 잘 일했는데, angularJS 때때로 모델을 새로 고치는 데 몇 초가 걸린다는 것입니다. 이렇게 하려면 데이터를 표시하는 동안 스피너를 넣을 수 있습니다.
단방향 데이터 바인딩은 데이터 모델에서 값을 가져와 HTML 요소에 삽입하는 접근 방식입니다. 보기에서 모델을 업데이트할 방법이 없습니다. 이것은 고전적인 템플릿 시스템에서 사용됩니다. 이러한 시스템은 데이터를 한 방향으로만 바인딩합니다.
Angular 앱의 데이터 바인딩은 모델과 뷰 구성 요소 간의 데이터 자동 동기화입니다.
데이터 바인딩을 사용하면 애플리케이션에서 모델을 단일 소스로 취급할 수 있습니다. 뷰는 항상 모델의 투영입니다. 모델이 변경되면 뷰에 변경 사항이 반영되고 그 반대의 경우도 마찬가지입니다.
다음은 입력 필드를 사용하여 AngularJS와 데이터 바인딩하는 예입니다. 나중에 설명하겠습니다
HTML 코드
<div ng-app="myApp" ng-controller="myCtrl" class="formInput"> <input type="text" ng-model="watchInput" Placeholder="type something"/> <p>{{watchInput}}</p> </div>AngularJS 코드
myApp = angular.module ("myApp", []); myApp.controller("myCtrl", ["$scope", function($scope){ //Your Controller code goes here }]); 위의 예에서 볼 수 있듯이 AngularJS 는 ng-model input 필드에서 일어나는 일을 듣고 관찰합니다. 무슨 일이 생기면, 뭔가를 하십시오. 우리의 경우 ng-model {{}} 사용하여 뷰에 바인딩됩니다. 입력 필드에 입력한 내용은 즉시 화면에 표시됩니다. AngularJS를 가장 단순한 형태로 사용하는 것이 데이터 바인딩의 장점입니다.
도움이 되었기를 바랍니다.
Codepen 에서 작업 예제를 참조하십시오.
AngularJs는 양방향 데이터 바인딩을 지원합니다.
데이터 보기 -> 컨트롤러 및 컨트롤러 -> 보기에 액세스할 수 있음을 의미합니다.
예를 들어
1)
// If $scope have some value in Controller. $scope.name = "Peter"; // HTML <div> {{ name }} </div>O/P
Peter 다음과 같이 ng-model 에서 데이터를 바인딩할 수 있습니다.
2)
<input ng-model="name" /> <div> {{ name }} </div> 여기 위의 예에서 사용자가 제공하는 모든 입력은 <div> 태그에 표시됩니다.
html에서 컨트롤러로 입력을 바인딩하려면:-
삼)
<form name="myForm" ng-submit="registration()"> <label> Name </lbel> <input ng-model="name" /> </form> 컨트롤러에서 name 을 사용하려면 여기에서
$scope.name = {}; $scope.registration = function() { console.log("You will get the name here ", $scope.name); }; ng-model 은 뷰를 바인딩하고 이를 표현식 {{ }} 렌더링합니다.
ng-model 은 뷰에서 사용자에게 표시되고 사용자가 상호 작용하는 데이터입니다.
따라서 AngularJs에서 데이터를 쉽게 바인딩할 수 있습니다.
Angular.js는 뷰에서 생성하는 모든 모델에 대한 감시자를 생성합니다. 모델이 변경될 때마다 "ng-dirty" 클래스가 모델에 추가되므로 관찰자는 "ng-dirty" 클래스가 있는 모든 모델을 관찰하고 컨트롤러에서 값을 업데이트하며 그 반대의 경우도 마찬가지입니다.
데이터 바인딩:
데이터 바인딩이란 무엇입니까?
사용자가 보기에서 데이터를 변경할 때마다 범위 모델에서 해당 변경 사항이 업데이트되고 그 반대의 경우도 마찬가지입니다.
그게 어떻게 가능해?
짧은 대답 : 다이제스트 사이클의 도움으로.
설명: Angular js는 범위 모델에 감시자를 설정하여 모델에 변경 사항이 있는 경우 수신기 기능을 실행합니다.
$scope.$watch('modelVar' , function(newValue,oldValue){// 새로운 값으로 Dom 업데이트 코드
});
그러면 watcher 함수는 언제 어떻게 호출됩니까?
Watcher 함수는 다이제스트 주기의 일부로 호출됩니다.
다이제스트 사이클은 다이제스트 사이클을 트리거할 수 있는 ng-model , ng-bind , $timeout, ng-click 등과 같은 지시문/서비스에 내장된 Angular js의 일부로 자동으로 트리거됩니다.
다이제스트 주기 기능:
$scope.$digest() -> digest cycle against the current scope. $scope.$apply() -> digest cycle against the parent scope 즉 $rootScope.$apply()
참고: $apply()는 $rootScope.$digest()와 같습니다. 즉, 더티 검사는 루트 또는 상위 또는 상위 범위에서 Angular js 애플리케이션의 모든 하위 $scope까지 바로 시작됨을 의미합니다.
위의 기능은 언급된 버전의 브라우저 IE에서 작동합니다. 응용 프로그램이 angular js 응용 프로그램인지 확인하는 것만으로도 스크립트 태그에서 참조하는 angularjs 프레임워크 스크립트 파일을 사용하고 있음을 의미합니다.
감사합니다.
출처 : http:www.stackoverflow.com/questions/9682092/how-does-data-binding-work-in-angularjs
| Bash에서 명령의 출력에 변수를 어떻게 설정합니까? (0) | 2021.12.04 |
|---|---|
| C++11은 표준화된 메모리 모델을 도입했습니다. 무슨 뜻이에요? 그리고 C++ 프로그래밍에 어떤 영향을 미칠까요? (0) | 2021.12.04 |
| 스마트 포인터란 무엇이며 언제 사용해야 합니까? (0) | 2021.12.04 |
| 푸시되지 않은 Git 커밋 보기 (0) | 2021.12.04 |
| C++11은 표준화된 메모리 모델을 도입했습니다. 무슨 뜻이에요? 그리고 C++ 프로그래밍에 어떤 영향을 미칠까요? (0) | 2021.12.04 |