অ্যাঙ্গুলারজেএস $scope.emit()
বা এর সমতুল্য নেই $scope.broadcast()
। কোনও উপাদানটির ভিতরে ইভেন্টএমিটারটি নিকটে আসে তবে আপনি যেমন উল্লেখ করেছেন, এটি কেবল তাত্ক্ষণিক প্যারেন্ট উপাদানগুলিতে একটি ইভেন্ট প্রেরণ করবে।
কৌণিক ক্ষেত্রে, অন্যান্য বিকল্প রয়েছে যা আমি নীচে ব্যাখ্যা করার চেষ্টা করব।
@ ইনপুট () বাইন্ডিংগুলি অ্যাপ্লিকেশন মডেলটিকে একটি নির্দেশিত অবজেক্ট গ্রাফের সাথে সংযোগ স্থাপনের অনুমতি দেয় (পাতাগুলিতে মূল)। কোনও উপাদানটির পরিবর্তন সনাক্তকারী কৌশলটির ডিফল্ট আচরণ হ'ল কোনও সংযুক্ত উপাদান থেকে সমস্ত বাইন্ডিংয়ের জন্য অ্যাপ্লিকেশন মডেলে সমস্ত পরিবর্তন প্রচার করা।
পাশে: দুটি ধরণের মডেল রয়েছে: মডেলগুলি এবং অ্যাপ্লিকেশন মডেলগুলি দেখুন। একটি অ্যাপ্লিকেশন মডেল @ ইনপুট () বাইন্ডিংগুলির মাধ্যমে সংযুক্ত। একটি ভিউ মডেল কেবলমাত্র একটি উপাদান সম্পত্তি (@ ইনপুট () দ্বারা সজ্জিত নয়) যা উপাদানগুলির টেমপ্লেটে আবদ্ধ।
আপনার প্রশ্নের উত্তর দিতে:
ভাইবোন উপাদানগুলির মধ্যে যদি আমার যোগাযোগের প্রয়োজন হয় তবে কী হবে?
ভাগ করা অ্যাপ্লিকেশন মডেল : ভাইবোনরা একটি ভাগ করা অ্যাপ্লিকেশন মডেলটির মাধ্যমে যোগাযোগ করতে পারে (ঠিক কৌনিক 1 এর মতো)। উদাহরণস্বরূপ, যখন কোনও ভাইবোন কোনও মডেলটিতে পরিবর্তন করে, অন্য ভাইবোন যে একই মডেলের সাথে বাইন্ডিং রাখে তা স্বয়ংক্রিয়ভাবে আপডেট হয়।
উপাদান ইভেন্টগুলি : শিশু উপাদানগুলি @ আউটপুট () বাইন্ডিং ব্যবহার করে প্যারেন্ট উপাদানগুলিতে একটি ইভেন্ট প্রেরণ করতে পারে। অভিভাবক উপাদান ইভেন্টটি পরিচালনা করতে পারে, এবং অ্যাপ্লিকেশন মডেলটি বা এটির নিজস্ব ভিউ মডেলটি পরিচালনা করতে পারে। অ্যাপ্লিকেশন মডেলের পরিবর্তনগুলি স্বয়ংক্রিয়ভাবে সমস্ত উপাদানগুলিতে প্রচারিত হয় যা প্রত্যক্ষ বা অপ্রত্যক্ষভাবে একই মডেলের সাথে আবদ্ধ হয়।
পরিষেবা ইভেন্ট : উপাদানগুলি সদস্যতা নিতে পারে। উদাহরণস্বরূপ, দুটি ভাইবোন উপাদান একই পরিষেবা ইভেন্টের সদস্যতা নিতে এবং তাদের নিজ নিজ মডেলগুলি সংশোধন করে সাড়া দিতে পারে। এই নীচে আরও।
আমি কীভাবে কোনও মূলের উপাদান এবং একটি উপাদানকে নীচের কয়েকটি স্তরের গভীরভাবে যোগাযোগ করতে পারি?
- ভাগ করা অ্যাপ্লিকেশন মডেল : অ্যাপ্লিকেশন মডেলটি রুট উপাদান থেকে নীচে @ ইনপুট () বাইন্ডিংয়ের মাধ্যমে গভীরভাবে নেস্ট করা সাব-উপাদানগুলিতে যেতে পারে। যে কোনও উপাদান থেকে একটি মডেল পরিবর্তনগুলি একই মডেলটি ভাগ করে এমন সমস্ত উপাদানগুলিতে স্বয়ংক্রিয়ভাবে প্রচার করবে।
- পরিষেবা ইভেন্টগুলি : আপনি ইভেন্টমিটারকে একটি ভাগ করা পরিষেবাতেও স্থানান্তর করতে পারেন যা কোনও উপাদানকে পরিষেবাটি ইনজেক্ট করতে এবং ইভেন্টটির সদস্যতা নিতে দেয়। এইভাবে, একটি রুট উপাদান কোনও পরিষেবা পদ্ধতিতে কল করতে পারে (সাধারণত মডেলটিকে পরিবর্তিত করে), যা ফলস্বরূপ একটি ইভেন্ট নির্গত করে। বেশ কয়েকটি স্তর নীচে, গ্র্যান্ড-চাইল্ড উপাদান যা পরিষেবাটি ইনজেকশনেও একই ইভেন্টে সাবস্ক্রাইব করেছে, এটি পরিচালনা করতে পারে। কোনও ইভেন্ট হ্যান্ডলার যা একটি ভাগ করা অ্যাপ্লিকেশন মডেল পরিবর্তন করে, স্বয়ংক্রিয়ভাবে তার উপর নির্ভর করে এমন সমস্ত উপাদানগুলিতে প্রচার করবে। এটি সম্ভবত
$scope.broadcast()
কৌনিক 1 এর নিকটতম সমতুল্য পরবর্তী অংশটি এই ধারণাটিকে আরও বিশদে বিশদে বর্ণনা করেছে।
পরিবর্তনগুলি প্রচারের জন্য পরিষেবা ইভেন্টগুলি ব্যবহার করে এমন একটি পর্যবেক্ষণযোগ্য পরিষেবার উদাহরণ
এখানে পর্যবেক্ষণযোগ্য পরিষেবার একটি উদাহরণ যা পরিবর্তনের প্রচারের জন্য পরিষেবা ইভেন্টগুলি ব্যবহার করে। যখন কোনও টোডো আইটেম যুক্ত করা হয়, পরিষেবাটি তার উপাদান সাবস্ক্রাইবারদের সূচিত করে একটি ইভেন্ট প্রেরণ করে।
export class TodoItem {
constructor(public name: string, public done: boolean) {
}
}
export class TodoService {
public itemAdded$: EventEmitter<TodoItem>;
private todoList: TodoItem[] = [];
constructor() {
this.itemAdded$ = new EventEmitter();
}
public list(): TodoItem[] {
return this.todoList;
}
public add(item: TodoItem): void {
this.todoList.push(item);
this.itemAdded$.emit(item);
}
}
এখানে কোনও মূল উপাদান কীভাবে ইভেন্টটির সাবস্ক্রাইব করবে:
export class RootComponent {
private addedItem: TodoItem;
constructor(todoService: TodoService) {
todoService.itemAdded$.subscribe(item => this.onItemAdded(item));
}
private onItemAdded(item: TodoItem): void {
// do something with added item
this.addedItem = item;
}
}
একটি শিশু উপাদান বিভিন্ন স্তরের নীস্টে একইভাবে ইভেন্টটির সাবস্ক্রাইব করবে:
export class GrandChildComponent {
private addedItem: TodoItem;
constructor(todoService: TodoService) {
todoService.itemAdded$.subscribe(item => this.onItemAdded(item));
}
private onItemAdded(item: TodoItem): void {
// do something with added item
this.addedItem = item;
}
}
ইভেন্টটি ট্রিগার করতে পরিষেবাটিকে কল করে এমন উপাদানটি এখানে রয়েছে (এটি উপাদান গাছের যে কোনও জায়গায় থাকতে পারে):
@Component({
selector: 'todo-list',
template: `
<ul>
<li *ngFor="#item of model"> {{ item.name }}
</li>
</ul>
<br />
Add Item <input type="text" #txt /> <button (click)="add(txt.value); txt.value='';">Add</button>
`
})
export class TriggeringComponent{
private model: TodoItem[];
constructor(private todoService: TodoService) {
this.model = todoService.list();
}
add(value: string) {
this.todoService.add(new TodoItem(value, false));
}
}
রেফারেন্স: কৌণিক মধ্যে সনাক্তকরণ পরিবর্তন