angularjs 데이터 양방향 연결 간결 원본 구현

1739 단어
hello.html


  HTML  


    
    {{name}}
    



hello.js

var Scope = function( ) {
    this.$$watchers = [];   
};

Scope.prototype.$watch = function( watchExp, listener ) {
    this.$$watchers.push( {
        watchExp: watchExp,
        listener: listener || function() {}
    } );
};

Scope.prototype.$digest = function( ) {
    var dirty;
    do {
            dirty = false;

            for( var i = 0; i < this.$$watchers.length; i++ ) {
                var newValue = this.$$watchers[i].watchExp(),
                    oldValue = this.$$watchers[i].last;

                if( oldValue !== newValue ) {
                    this.$$watchers[i].listener(newValue, oldValue);

                    dirty = true;

                    this.$$watchers[i].last = newValue;
                }
            }
    } while(dirty);
};

//angularjs 
var $scope = new Scope();

// , name, 
$scope.name = '';
// {{name}},, {{name}}, ng-model="name" $scope.name 
var modelList1 = [];//ng-model
var modelList2 = [];//{{}}
var spanList = document.querySelectorAll('span');
for(var i =0;i$$watchers 


setTimeout(function(){
    updateScopeValue();
},3000);
var updateScopeValue = function updateScopeValue( ) {
    $scope.name = ' ';
    $scope.$digest();
};

좋은 웹페이지 즐겨찾기