Angular Academy · Ders

Bağımlılıkları Doğrudan İçeri Aktarma

İçeri aktarmaları modül yerine bileşene ekleyin.

Bağımlılıkları Doğrudan İçeri Aktarma, CoddyKit'te ücretsiz bir Angular Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Angular Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Angular Academy kursu toplamda 4 dersten oluşur.

Bağımlılıkları Doğrudan İçe Aktarma

Bağımsız bir bileşen, kullandığı öğeleri kendi imports dizisinde tanımlar. Bu, NgModule tanımlar/içe aktarmalar ayrımının yerini alır.

imports Dizisi

Diğer bağımsız bileşenleri, yönergeleri ve pipe'ları @Component dekoratörünün imports dizisine ekleyin.

import { Component } from '@angular/core';
import { ChildComponent } from './child.component';

@Component({
  selector: 'app-parent',
  imports: [ChildComponent],
  template: '<app-child></app-child>'
})
export class ParentComponent {}

Diğer Bileşenleri İçe Aktarma

Şablonunuzda bir alt bileşeni görüntülemek için onun sınıfını içe aktarın. Ardından seçicisi kullanılabilir hâle gelir.

Yönergeleri İçe Aktarma

Bağımsız yönergeler de aynı şekilde içe aktarılır. İçe aktardıktan sonra onları şablonda uygulayabilirsiniz.

import { Component } from '@angular/core';
import { HighlightDirective } from './highlight.directive';

@Component({
  selector: 'app-note',
  imports: [HighlightDirective],
  template: '<p appHighlight>Note</p>'
})
export class NoteComponent {}

Pipe'ları İçe Aktarma

Bağımsız pipe'lar da imports dizisine eklenir. Örneğin, özel bir pipe'ı içe aktarmak onu enterpolasyonda kullanmanızı sağlar.

Yaygın Angular Yönergeleri

Bazı yerleşik yardımcılar paketlerden gelir. Örneğin RouterLink, @angular/router paketinden gelir ve kullanılabilmesi için içe aktarılması gerekir.

import { RouterLink } from '@angular/router';

@Component({
  selector: 'app-nav',
  imports: [RouterLink],
  template: '<a routerLink="/home">Home</a>'
})
export class NavComponent {}

FormsModule ve Benzerleri

Mevcut NgModules'ları da bağımsız bir bileşene aktarabilirsiniz. FormsModule içe aktarıldığında ngModel gibi şablon yönlendirmeli form özellikleri etkinleşir.

import { FormsModule } from '@angular/forms';

@Component({
  selector: 'app-form',
  imports: [FormsModule],
  template: '<input [(ngModel)]="name">'
})
export class FormComponent {
  name = '';
}

Yerleşik Denetim Akışı İçin İçe Aktarma Gerekmez

Yerleşik denetim akışı blokları (if, for, switch, defer) şablon dilinin kendisine aittir; bu nedenle içe aktarma gerekmez. Bu, eski yapısal yönergelerden farklıdır.

Yalnızca Kullandıklarınızı İçe Aktarın

İçe aktarmaları sınırlı tutun: yalnızca şablonun gerçekten başvurduğu bağımlılıkları listeleyin. Bu, bileşenleri yalın ve ağaç sarsmaya uygun tutar.

Birden Çok Öğe İçe Aktarma

imports dizisinde birçok öğeyi birlikte listeleyebilirsiniz.

imports: [ChildComponent, HighlightDirective, RouterLink, FormsModule]

Derleme Hataları Size Yol Gösterir

İçe aktarılmamış bir seçici veya pipe kullanırsanız Angular, bunun ilgili bileşende bilinmediğini belirten açık bir hata bildirir. Düzeltmek için onu imports dizisine ekleyin.

Kısa Kontrol: İçe Aktarmalar

Bağımsız bileşen bağımlılıkları nereye eklenir?

Özet: Doğrudan İçe Aktarmalar

Bağımsız bileşenler bağımlılıklarını bileşenin imports dizisinde listeler: diğer bileşenler, yönergeler, pipe'lar ve FormsModule gibi NgModules bile. Yerleşik denetim akışı için içe aktarma gerekmez. İçe aktarmaları sınırlı tutun. Sırada: bağımsız bir uygulamayı başlatmak var.

Sıkça Sorulan Sorular

“Bağımlılıkları Doğrudan İçeri Aktarma” dersi ücretsiz mi?

Evet — “Bağımlılıkları Doğrudan İçeri Aktarma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Angular Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Angular Academy kursu toplamda 4 dersten oluşur.

“Bağımlılıkları Doğrudan İçeri Aktarma” dersinde ne öğreneceğim?

İçeri aktarmaları modül yerine bileşene ekleyin. Angular Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Angular Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Angular Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“Bağımlılıkları Doğrudan İçeri Aktarma” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Angular Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Angular Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← Angular Academy Sayfasına Dön