Development Tip

Angular2 IE11 정의되지 않은 참조 또는 null 참조의 'apply'속성을 가져올 수 없습니다.

yourdevel 2020. 11. 9. 21:14
반응형

Angular2 IE11 정의되지 않은 참조 또는 null 참조의 'apply'속성을 가져올 수 없습니다.


angular2 패키지를 다음 버전으로 업그레이드 한 후 다음 오류가 발생합니다.

  • @ angular / common ":"^ 2.3.1
  • @ angular / compiler ":"^ 2.3.1
  • @ angular / core ":"^ 2.3.1
  • @ angular / forms ":"^ 2.3.1
  • @ angular / http ":"^ 2.3.1
  • @ angular / platform-browser ":"^ 2.3.1 "
  • @ angular / platform-browser-dynamic ":"^ 2.3.1
  • @ angular / platform-server ":"^ 2.3.1
  • @ angular / router ":"^ 3.3.1

오류 :Unable to get property 'apply' of undefined or null reference

여기에 이미지 설명 입력

IE11에서만이 오류가 발생하며 Chrome에서는 정상적으로 작동합니다.

나는 파고 들었고 오류를 일으키는 선은 angular / common 모듈에 있습니다.

function combine(options) {
  return (_a = ((Object))).assign.apply(_a, [{}].concat(options));
  var _a;
}

typescript 파일 :

@ angular / common / src / pipes / intl.ts 라인 175

function combine(options: Intl.DateTimeFormatOptions[]): Intl.DateTimeFormatOptions {
  return (<any>Object).assign({}, ...options);
}

combine함수 를 호출하는 코드 @ angular / common / src / pipes / intl.ts 48 행입니다.

'yMMMdjms': datePartGetterFactory(combine([


최신 정보

실제 오류는 해당 .assign메서드가 IE11에서 구현되지 않은 것 같습니다.


@angular/cliIE9-11을 사용 중이고 지원하려는 경우 src/polyfills.ts파일을 편집하여 적절한 폴리 필을 활성화 할 수 있습니다 . 필요한 폴리 필이 이미 파일에 있으므로 주석 처리를 제거하기 만하면됩니다.

기본적으로 @angular/cli프로젝트는 즉시 사용 가능한 "상시적인"브라우저를 대상 으로 합니다. 즉, IE는 즉시 지원되지 않지만 필요한 기능에 대한 polyfill을 가져 와서 지원을 추가 할 수 있습니다.


Angular는 core-js 에 의존합니다 . 따라서 Object.assign 폴리 필을 사용할 수 있습니다 .

import "core-js/client/shim"; // or load it before other angular2 & zone.js stuff
import "zone.js";
import "reflect-metadata";

에 따르면 MDN의 Object.assign()브라우저 호환성 IE는 지원되지 않습니다.

npm을 사용 Object.assign하여 MDN 으로 polyfill을 가져올 수 있습니다 . ( mdn-polyfills )

운영: npm i mdn-polyfills --save

사용하다: import 'mdn-polyfills/Object.assign';


Angular Materials 튜토리얼 에서이 문제를 언급하지 않는 것은 정말 짜증납니다 . IE11을 사용하고 튜토리얼을 따르는 사람은 누구나이 문제에 부딪 힐 것입니다.

다른 사람들이 언급했듯이 해결책은 단순히 프로젝트 polyfills.ts파일 에서 해당 줄의 주석 처리를 제거하는 것 입니다.

여기에 이미지 설명 입력

그러나 실제로 이것은 그들의 튜토리얼에서 언급되었을 것입니다.

이러한 Angular 문제에 대한 해결책을 찾기 위해 인터넷 검색에 너무 많은 시간을 보내고 있습니다.


IE 브라우저에서 작업하려면

1 단계 : 실행 :npm i mdn-polyfills --save

2 단계 : 열기 polyfills.ts

3 단계 : / ** IE9, IE10 및 IE11 아래의 파일에서 가져 오기의 주석 처리 를 제거하려면 다음 폴리 필이 모두 필요합니다. ** /


polyfills.ts에서 다음을 추가하십시오.

import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/set';

누구든지 IE를 사용하는 dotnet core 2.0 Angular 템플릿 에서이 오류가 발생하면 이것이 해결 방법입니다.

  1. core-js 설치

    npm install core-js --save

  2. ClientApp / boot.browser.ts 상단에이 줄을 추가합니다.

    import 'core-js / client / shim';


angular 4.x를 사용 중이고이 오류가 발생하면 https://github.com/angular/angular-cli/issues/6036에 설명 된 솔루션이 저에게 효과적이었습니다.

"zone.js"버전 0.8.8에 버그가있는 것 같습니다. 그러나 0.8.4 버전으로 다시 다운 그레이드하면 문제가 해결되었습니다. 자세한 내용은 링크를 참조하십시오.


속성 '적용'을 가져올 수없는 Angular 4 IE11 수정

1 단계 : app / boot-browser-ts 열기

2 단계 : 아래 줄 추가

import 'core-js/client/shim'; 

angular-cli (v1.0.0-rc.0)에는 브라우저에 필요한 모든 polyfill의 주석 처리를 해제해야하는 polyfills.ts라는 파일이있는 것 같습니다. IE-11에서 설치가 전혀 없어도 잘 작동합니다.


Stas Berkov가 옳았 고 그의 대답은 약간 다른 해결책을 찾았습니다.

모든 Angular 스크립트를로드하는 헤더에 shim.js를 포함했습니다. (배포시 번들 / 축소). 참고 : shim.js가 zone.js보다 먼저로드되는 것이 중요합니다. 그렇지 않으면 다른 오류가 발생합니다.

<script src="/<my domain>/node_modules/core-js/client/shim.js"></script>
<script src="/<my domain>/node_modules/zone.js/dist/zone.js"></script>
<script src="/<my domain>/node_modules/reflect-metadata/Reflect.js"></script>
<script src="/<my domain>/node_modules/systemjs/dist/system.src.js"></script>

<script src="/<my domain>/systemjs.config.js"></script>

참고 URL : https://stackoverflow.com/questions/41276692/angular2-ie11-unable-to-get-property-apply-of-undefined-or-null-reference

반응형