AngularJs에서 템플릿 캐싱을 비활성화하는 방법

이 글에서는 주로 AngularJs에서 템플릿 캐싱을 비활성화하는 방법을 소개합니다. 편집자가 꽤 좋다고 생각해서 지금 공유하고 참고하겠습니다. 에디터를 따라가며 함께 살펴볼까요

이 글에서는 AngularJs에서 템플릿 캐싱을 비활성화하는 방법을 소개하고, 모두와 공유하고, 직접 메모를 남기는 방법을 다음과 같이 소개합니다.

AngularJs(또는 캐시)의 특성상 브라우저 자체?), Angular의 기본 HTML 템플릿 로딩이 캐시됩니다. 결과적으로 템플릿을 수정할 때마다 브라우저가 최신 html 템플릿을 가져오는지 확인하기 위해 브라우저의 캐시를 지워야 하는 경우가 많습니다. 직접 테스트하는 것은 괜찮지만 서버의 템플릿 콘텐츠가 업데이트되는 경우에는 그렇지 않을 수도 있습니다. 사용자가 귀하에게 협조할 것입니다. 브라우저의 캐시를 지웁니다. 그래서 이것은 정말 큰 문제입니다.

app.config(function($routeProvider, $locationProvider) { 
 $routeProvider 
  .when('/Book/:bookId/ch/', { 
  templateUrl: 'chapter.html', 
  controller: 'ChapterController' 
 }); 
});

방법 1: 템플릿 파일 경로 뒤에 타임스탬프(또는 다른 임의의 숫자)를 추가하여 AngularJ가 매번 서버에서 새 템플릿을 로드하도록 합니다.

app.config(function($routeProvider, $locationProvider) { 
 $routeProvider 
  .when('/Book/:bookId/ch/', { 
  templateUrl: 'chapter.html' + '?datestamp=' + (new Date()).getTime(), 
  controller: 'ChapterController' 
 }); 
});

하지만 이 방법은 보기에 너무 좋지 않습니다. . . .

방법 2: $templateCache를 사용하여 캐시 삭제

// 禁止模板缓存 
app.run(function($rootScope, $templateCache) { 
  $rootScope.$on('$routeChangeStart', function(event, next, current) { 
    if (typeof(current) !== 'undefined'){ 
      $templateCache.remove(current.templateUrl); 
    } 
  }); 
});

라우팅 주소를 구성한 후 app.config 뒤에 이 코드를 추가하여 AngularJ가 templateUrl을 캐싱하는 것을 방지합니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

vue에서 전체 텍스트 읽기를 구현하는 방법

vue에서 dom 요소를 얻는 방법

js에서 변환 타임스탬프 형식을 구현하는 방법

nginx에 vue 프로젝트 배포(자세한 내용) 튜토리얼)

JavaScript에서 콘텐츠를 추가하기 위해 요소 스크롤 막대 루프를 구현하는 방법

vue+swiper에서 측면 슬라이딩 메뉴 효과를 구현하는 방법

위 내용은 AngularJs에서 템플릿 캐싱을 비활성화하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!