사용자 정의 Angular에 '바꾸기' 기능을 사용하는 방법JS 디렉티브?

사용자 정의 Angular에 '바꾸기' 기능을 사용하는 방법JS 디렉티브?

왜?replace=true또는replace=false아래 코드에 영향이 없습니까?

replace=false일 때 "기존 콘텐츠"가 표시되지 않는 이유는 무엇입니까?

아니면 좀 더 겸허하게 말씀드리면요.replace=true/false기능과 사용 방법에 대해 설명하겠습니다.

예

JS/각도:

<script>
    angular.module('scopes', [])
          .controller('Ctrl', function($scope) {
                $scope.title = "hello";

          })
          .directive('myDir', function() {
            return {
              restrict: 'E',
              replace: true,
              template: '<div>{{title}}</div>'
            };
      });
</script>

HTML:

<div ng-controller="Ctrl">
    <my-dir><h3>some existing content</h3></my-dir>
</div>

여기 Plunker에서 확인:

http://plnkr.co/edit/4ywZGwfsKHLAoGL38vvW?p=preview

가지고 있을 때replace: true다음과 같은 DOM을 얻을 수 있습니다.

<div ng-controller="Ctrl" class="ng-scope">
    <div class="ng-binding">hello</div>
</div>

반면, 와 함께replace: false다음과 같이 표시됩니다.

<div ng-controller="Ctrl" class="ng-scope">
    <my-dir>
        <div class="ng-binding">hello</div>
    </my-dir>
</div>

그래서...replaceproperty in directives는 디렉티브가 적용되는 요소가 있는지 여부를 나타냅니다.<my-dir>(이 경우)은 남아 있어야 합니다.replace: false명령어 템플릿은 그 자식으로 추가되어야 합니다.

또는

지침이 적용되는 요소를 교체해야 한다.replace: true를 참조해 주세요.

어느 경우든 (지시가 적용되는) 요소는 소실됩니다.요소의 원래 내용/하위를 유지하려면 요소를 변환해야 합니다.다음 지시문이 이를 수행할 수 있습니다.

.directive('myDir', function() {
    return {
        restrict: 'E',
        replace: false,
        transclude: true,
        template: '<div>{{title}}<div ng-transclude></div></div>'
    };
});

이 경우 지시문 템플릿에 속성을 가진 요소가 있는 경우ng-transclude그 내용은 (지시가 적용되는) 요소의 원래 콘텐츠로 대체됩니다.

변환의 예를 참조해 주세요.http://plnkr.co/edit/2DJQydBjgwj9vExLn3Ik?p=preview

번역에 대한 자세한 내용은 여기를 참조하십시오.

replace:true권장되지 않음

문서에서:

replace([사용 중지됨])는 다음 메이저릴리즈(v2.0)에서 삭제될 예정입니다.

템플릿의 대체 대상을 지정합니다.디폴트:false.

• true- 템플릿이 디렉티브의 요소를 대체합니다.
• false- 템플릿이 디렉티브 요소의 내용을 대체합니다.

-- 각진 모습JS 종합 지시 API

GitHub에서:

케이텝- 이건 더 이상 추천되지 않는 이유죠.replace: true그 중 상당수는 합리적인 방법으로 고칠 수 없습니다.이러한 문제를 주의해서 회피하면 파워가 높아집니다만, 새로운 유저의 이익을 위해서, 「이것이 골칫거리입니다.하지 마세요」라고 말하는 것은 간단합니다.

-- 각진 모습JS호 7636

---

갱신하다

주의:replace: true는 권장되지 않으며 주로 여기에 나열된 문제로 인해 사용을 권장하지 않습니다.새 Angular에서 완전히 제거되었습니다.

교환에 관한 문제: true

• 특성 값은 병합되지 않습니다.
• 명령어는 컴파일 전에 중복 배제되지 않습니다.
• transclude: element치 않은 영향을 수 .

상세한 것에 대하여는, 을 참조해 주세요.

• AngularJS 레퍼런스 - 관련 JS $compile Service API - js jsreplace:true

언급URL : https://stackoverflow.com/questions/22497706/how-to-use-the-replace-feature-for-custom-angularjs-directives