각도의 사용자 정의 지시문을 사용하는 방법

이번에는Angular의 사용자 정의 명령을 사용하는 방법과Angular의 사용자 정의 명령을 사용할 때 주의 사항이 무엇인지 보여 드리겠습니다.

맞춤 지정

angular.module(&#39;dir&#39;,[  ]).directive( &#39;mydir&#39; ,function(  ){   return {template:&#39;<div>hello</div>&#39;}} )

원본 HTML로 속성 확장을 맞춤 지정합니다.

지정된 응용 프로그램:

<div mydir> </div>写成自定义属性                      ----A----属性
-<mydir></mydir>写成元素。注意如果需要改变模板路径里面的内容，就需要使用ng-transclude,然后在模板指令的配置项里写
return {templateUrl :../template.html,transclued:true}          -----E----元素

구성 항목에 templateUrl(scope:{footer:@footer})을 작성할 수 있습니다(@footer의 요소 태그에 있는 바닥글은 속성입니다).

Error: $compile:iscp

Invalid Isolate Scope Definition
Description
When declaring isolate scope the scope definition object must be in specific format which starts with mode character (@&=<), after which comes an optional ?, and it ends with an optional local name.
myModule.directive(&#39;directiveName&#39;, function factory() {  return {
    ...
    scope: {      &#39;localName&#39;: &#39;@&#39;, // OK
      &#39;localName2&#39;: &#39;&attr&#39;, // OK
      &#39;localName3&#39;: &#39;<?attr&#39;, // OK
      &#39;localName4&#39;: &#39; = attr&#39;, // OK
      &#39;localName5&#39;: &#39; =*attr&#39;, // OK      
      &#39;localName6&#39;: &#39;attr&#39;,    // ERROR: missing mode @&=<
      &#39;localName7&#39;: &#39;attr=&#39;,   // ERROR: must be prefixed with @&=<
      &#39;localName8&#39;: &#39;=attr?&#39;,  // ERROR: ? must come directly after the mode
      &#39;localName9&#39;: &#39;<*&#39;  // ERROR: * is only valid with =
    }
    ...
  }
});

지침 카멜 케이스 이름 지정('myDir')을 사용하세요. html은 대소문자를 구분하지 않기 때문에 my-dir을 사용하여 html로 지침을 작성할 수 있습니다.
-- templateUrl(scope:{footer:@footer}, replacement:true)의 교체: true는 사용자 지정 태그를 대체할 수 있습니다.

지정된 클래스의 형식:

, 그러나 기본값은 A||E이므로 일치하는 패턴 구성 항목을 추가해야 합니다:
templateUrl(scope: {footer: @footer}, 제한:C)를 성공적으로 추가할 수 있습니다. ------카테고리 C------

A, C, E, M 총 4가지 매칭 모드가 있습니다. (Comments, 덜 자주 사용되는 매칭 모드) 기본값은 A | E입니다.

이 기사의 사례를 읽으신 후에는 PHP 중국어 웹사이트의 다른 관련 기사를 주목해 보세요.

추천 도서:

$watch, $apply 및 $digest의 데이터 바인딩 프로세스에 대한 자세한 설명

javascript에 대한 자세한 설명

js에 내장된 객체는 무엇입니까?

위 내용은 각도의 사용자 정의 지시문을 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!