2016-04-07 19 views
5

मैं जो कोणीय 2.कोणीय 2 आग घटना के बाद ngFor

में कुछ गतिशील तत्वों के अंदर डिफ़ॉल्ट स्क्रॉलबार की जगह इन तत्वों को एक ngFor पाश का उपयोग कर बनाई गई हैं एक jQuery प्लगइन का उपयोग करने के लिए कोशिश कर रहा हूँ, कि मैं अनुलग्न नहीं कर सकते है इन तत्वों के लिए jQuery घटनाओं को बनाया गया है।

कुछ बिंदु पर एप्लिकेशन Observable ऑब्जेक्ट को संशोधित करता है जो दृश्य प्रस्तुत करने के लिए ngFor के अंदर है।

अब, मैं जानना चाहता हूं कि कोणीय मेरे तत्वों को आकर्षित करने के लिए कब समाप्त होता है ताकि मैं jQuery प्लगइन चला सकूं।

  • मैं HTML टेम्पलेट में कोई जावास्क्रिप्ट शामिल नहीं करना चाहता हूं।
  • मैं करते हैं, ngAfterViewInit उपयोग नहीं करना चाहते यह हुक क्योंकि कई बार
  • निकाल दिया जाता है
  • मैं एक setTimeout आधारित समाधान को लागू नहीं करना चाहते हैं (मुझे लगता है कि यह विश्वसनीय नहीं है)

मैं पाया निम्नलिखित कस्टम Pipe का उपयोग करके एक समाधान: टेम्पलेट में ngFor चक्र के अंत में, मैं लिखने:

{{i | FireStoreEventPipe:'EVENT_TO_BE_FIRED'}} 

कहाँ FireStoreEventPipe है कुछ की तरह:

transform(obj: any, args:any[]) { 
    var event = args[0]; 
    //Fire event 
    return null; 
} 

लेकिन यह समाधान मुझे संतुष्ट नहीं करता है।

बेहतर तरीके से कोई सुझाव?

धन्यवाद

+0

आप तो

import { Component, Input, Output, EventEmitter } from '@angular/core'; @Component({ selector: 'islast', template: '<span></span>' }) export class LastDirective { @Input() isLast: boolean; @Output() onLastDone: EventEmitter<boolean> = new EventEmitter<boolean>(); ngOnInit() { if (this.isLast) this.onLastDone.emit(true); } } 

तब मैं निर्देशों में बच्चे घटक के रूप में मेरी वांछित घटक में आयातित ऐसा नहीं लगता कि यह एक डुप्लिकेट है जिसे इसे फिर से खोलने के लिए एक टिप्पणी जोड़ें। –

+0

मुझे लगता है कि यह एक डुप्लिकेट नहीं है, क्योंकि मैं 'ngAfterViewInit' का उपयोग नहीं कर सकता (मैंने कोशिश की लेकिन यह मेरे लिए ठीक नहीं है, क्योंकि इसे कई बार निकाल दिया गया है), और मैं setTimeout- आधारित समाधान (जो हैं) से बेहतर कुछ ढूंढ रहा था ग़ैरभरोसेमंद)। मैं इन प्रश्नों के साथ अपना प्रश्न संपादित करूंगा –

+0

'ngAfterViewInit() 'केवल एक बार AFAIK कहा जाता है मुझे लगता है कि यह अक्सर पर्याप्त नहीं होता है। मुझे नहीं लगता कि आपको एक और परिणाम मिलेगा क्योंकि एंगुलर डीओएम अपडेट करने के बाद कॉल करने के लिए कुछ भी नहीं प्रदान करता है। मैं जांचता हूं कि गिटहब रेपो में इसके लिए कोई मुद्दा है या नहीं, अन्यथा एक बनाएं। –

उत्तर

5

मुझे एक ही समस्या थी। मैं कोणीय 2 आरसी का उपयोग कर रहा हूं 1.

मैंने इसे एक नया घटक बनाकर हल किया (एक निर्देश मेरे लिए काम नहीं करता)।

directives: [LastDirective], 

एचटीएमएल में:

<tr *ngFor="let sm of filteredMembers; let last = last; let i=index;" data-id="{{sm.Id}}"> 
    <td> 
     <islast [isLast]="last" (onLastDone)="modalMembersDone()"></islast> 
    </td> 
</tr> 

और निश्चित रूप से लागू modalMembersDone()

संबंधित मुद्दे