Angular 템플릿에 코멘트(출력 HTML이 아닌 개발자용)를 추가하려면 어떻게 해야 합니까?

Angular 템플릿에 코멘트(출력 HTML이 아닌 개발자용)를 추가하려면 어떻게 해야 합니까?

더 인기 있는 'mustache' 스타일 템플릿에 익숙합니다. 이 템플릿에서는 다음과 같이 동료에게 의견을 추가할 수 있습니다.

{# The following code looks a bit odd, but here's why... #}

이러한 코멘트는 출력에 표시되지 않기 때문에, 유저에게는 표시되지 않습니다.Angular에서 어떻게 비슷한 걸 할 수 있죠?

Angular에는 템플릿 주석 지원이 포함되어 있지 않습니다.다만, 다음과 같이 코멘트 디렉티브를 작성할 수 있습니다.

app.directive('templateComment', function () {
    return {
        restrict: 'E',
        compile: function (tElement, attrs) {
            tElement.remove();
        }
    };
});

마크업은 다음과 같습니다.

<template-comment>Put your comment here.</template-comment>

또는 표준 html 주석을 사용한 후 배포하기 전에 프로덕션 코드에서 제거할 수 있습니다.

블록 코멘트를 지원하려면 이 grunt 작업을 고려하십시오.https://github.com/philipwalton/grunt-strip-code 시작 코멘트와 종료 코멘트를 지정하면 이 작업을 전개 대상에 추가할 경우 코멘트 블록이 프로덕션 코드에서 삭제됩니다.Grunt를 사용하지 않는 경우 빌드 프로세스의 모델로 사용하십시오. ......

이 질문이 나온 지 7년이 넘었다는 것은 알고 있습니다만, 「각도 템플릿 코멘트」의 검색 결과 톱의 하나이기 때문에, 여기 있습니다.

(html이 아닌) 코멘트에 대한 템플릿 구문은 아직 지원되지 않는 것 같기 때문에 가장 쉬운 방법은 임베디드 식에서 한 줄 j 코멘트의 지원을 남용하는 것입니다.다음과 같이 합니다.

{{ '' // my comment }}

빈 문자열 리터럴이 필요합니다.이 문자열 리터럴이 없으면 각도 컴파일러는 적어도 9.0.0 버전에서는 'ERROR in TypeError: Cannot read property 'visit' of undefined'를 토해내기 때문입니다.

2021년 웹 개발 성공!

다음과 같은 특별한 기호 없이 코멘트에 일반 구문을 사용할 수 있습니다.<!-- Order verification, and authorization -->그러면 html(grunt + htmlmin)을 최소화할 수 있습니다.

htmlmin: {
      dist: {
        options: {
          collapseWhitespace: true,
          collapseBooleanAttributes: true,
          removeCommentsFromCDATA: true,
          removeOptionalTags: true,
          removeComments: true,
          ignoreCustomComments: [ /[<>\:\[\]\#]+/ ]

        },
        files: [{
          expand: true,
          cwd: '<%= yeoman.dist %>',
          src: ['*.html', 'views/**/*.html'],
          dest: '<%= yeoman.dist %>'
        }]
      }
    },

언급URL : https://stackoverflow.com/questions/18063475/how-can-i-add-a-comment-for-developers-not-in-output-html-to-an-angular-templ