$parse 또는 $eval을 사용하여 AngularJS_AngularJS에서 런타임 시 범위 변수에 값을 할당하는 방법

"AngularJS에서 테이블에 대한 지시문 사용자 정의"에서는 테이블에 대한 지시문을 다음과 같이 표현합니다.

<table-helper datasource="customers" clumnmap="[{name: 'Name'}, {street: 'Street'}, {age: 'Age'}, {url: 'URL', hidden: true}]"></table-helper>

위에서 colmnmap 변수의 값은 범위에 사전 정의되어 있습니다.

return {
restrict: 'E',
scope: {
columnmap: '=',
datasource: '='
},
link:link,
template:template
}; 

AngularJS에는 런타임에 Scope 변수에 값을 할당하는 방법도 있는데, 이는 링크 함수에서 $parse 또는 $eval 메서드 를 사용하는 것입니다.

Direcitve의 프리젠테이션은 이전과 동일합니다.

<table-helper-with-parse datasource="customers" columnmap="[{name: 'Name'},...]"></table-helper-with-parse>

지침은 대략 다음과 같습니다.

var tableHelperWithParse = function($parse){
var template = "",
link = function(scope, element, attrs){
var headerCols = [],
tableStart = '<table>',
tableEnd = '</table>',
table = '',
visibleProps = [],
sortCol = null,
sortDir = 1,
columnmap = null;
$scope.$watchCollection('datasource', render);
//运行时赋值columnmap
columnmap = scope.$eval(attrs.columnmap);
//或者
columnmap = $parse(attrs.columnmap)();
wireEvents();
function rener(){
if(scope.datasource && scope.datasourse.length){
table += tableStart;
table += renderHeader();
table += renderRows() + tableEnd;
renderTable();
}
}
};
return {
restrict: 'E',
scope: {
datasource: '='
},
link: link,
template: template
}
}
angular.module('direcitvesModule')
.directive('tableHelperWithParse', tableHelperWithParse);

$parse와 $eval의 차이점을 소개해드리겠습니다

우선 $parse와 $eval은 모두 표현식을 구문 분석하는 데 사용되지만 $parse는 별도의 서비스로 존재합니다. $eval은 범위 방법으로 사용됩니다.

$parse는 일반적으로 실제 객체에 매핑된 문자열 표현식의 값을 설정하는 데 사용됩니다. $parse에서 직접 표현식에 해당하는 값을 가져올 수도 있습니다.

var getter = $parse('user.name'); 
var setter = getter.assign; 
setter(scope, 'new name');
getter(context, locals) // 传入作用域，返回值
setter(scope,'new name') // 修改映射在scope上的属性的值为‘new value'

$eval은 다음과 같이 현재 범위에서 표현식을 실행하는scope.$eval입니다. 여기서 a와 b는 범위 = {a: 2 , b에서 나옵니다. :3};

소스코드를 보면 그 구현이

$eval: function(expr, locals) {
return $parse(expr)(this, locals);
},

역시 $parse 기반인 것을 알 수 있지만 해당 매개변수는 현재 범위인 이것으로 고정되어 있으므로 $eval은 $parse 기반 패키지일 뿐이며 $parse에 대한 빠른 API입니다. .