#ngfor

Angular NgFor Tutorial With Example | NgForOf Directive https://morioh.com/p/abc87f0bc5e5

Angular 6 - Directives, Structural Directives, Attribute Directives and Component Directives

Directives are basic building block for an Angular project. Directives consist of three major categories, they are; 

Component Directive 

Structural Directives 

Attribute Directives 

00:23 - Types of Directives

00:53 - Component Directive 

2:29 - *ngFor 

4:22 - *ngFor Exported Values 

8:54 - *ngIf 

16:09 - *ngSwitchCase 

25:12 - Attribute Directive 

25:39 - ngClass 

Angular2でngForを使うと、配列のような構造をもとに、記入欄やメッセージ欄のような定型的な要素を繰り返し生成できるようになっていますが、気になるのがその処理速度。何度もDOMを生成・削除しないか心配でした。

しかしAngularはしっかり者で、無駄な処理はしないよう工夫されていました。その工夫を生かすのが「TrackBy」という機能。

オブジェクトの持つIDのような要素でオブジェクトを識別できるようにしてあげると、オブジェクトの内容が変わったのか否かを効率よく判断できるようになるそうです。

[AngularJS2] Error : Unexpected directive value 'undefined' on the View of component @angularjs @AngularJS_News

If you see error in angularJS 2.0 something like this: Unexpected directive value ‘undefined’ on the View of component Make sure your directive value is correct which is added in viewAnnotations. Example : HelloAngular.annotations = [ new angular.ComponentAnnotation({ selector: 'hello' }), new angular.ViewAnnotation({ template: '

{{message}}

' + '

[Error] : Can't bind to 'ngForOf' since it isn't a know property of the 'template' element @angularjs #angularjs

If you see an error like this in angularJS2 application. Can’t bind to ‘ngForOf’ since it isn’t a known property of the ‘template’ element and there are no matching directives with a corresponding property Make sure you add the angular.NgFor directives in directives of viewAnnotations. Example Code: HelloAngular.annotations = [ new angular.ComponentAnnotation({ selector: 'hello' }), new…