angularjs 1.5 घटक/निर्देश

Question

पर $ scope कैसे पास करें I कोणीय 1.5 में नई .component() विधि का उपयोग करने का प्रयास कर रहा हूं। वर्तमान में मुझे इसका उपयोग करने के बारे में कम जानकारी मिली है। कोणीय दस्तावेज़ वास्तव में इसका उल्लेख नहीं करते हैं।

मैं दायरे से किसी ऑब्जेक्ट को घटक के टेम्पलेट भाग में उपयोग करने के लिए .component को पास करने की कोशिश कर रहा हूं लेकिन केवल दो पैरामीटर जिन्हें मैं पास कर सकता हूं वे $ तत्व और $ attrs हैं। मैंने एचटीएमएल में एक विशेषता के माध्यम से ऑब्जेक्ट को पार करने का प्रयास किया है, लेकिन मुझे ऑब्जेक्ट्स नाम की स्ट्रिंग मिली है।

मैं इसे स्थापित करने की कोशिश की है इन तरीकों

my-attr="item.myVal" 
my-attr="{item.myVal}" 
my-attr="{{item.myVal}}" 

में हर बार मैं अभी भी स्ट्रिंग शाब्दिक और नहीं चर का मान प्राप्त एक चर के रूप में प्रतिनिधित्व किया जाना है। मैं इसे एक चर के रूप में कैसे माना जा सकता है?

मैंने नए बाइंडिंग के माध्यम से डेटा कैप्चर करने का प्रयास किया है: {} लेकिन मेरा टेम्पलेट: {} तब चर के लिए उपयोग नहीं किया गया था।

यहाँ मेरी घटक है जैसा कि अभी है:

export var ItemListAction = { 
    controller: 'PanelCtrl as itemCtrl', 
    isolate: false, 
    template: ($element: any, $attrs: any): any=> { 
     var myVal: any = $attrs.myAttr; // returns "item.myVal" 
     var listAction: string = compileListAction(); 
     return listAction; 
    } 
}; 

यहाँ HTML में मेरी घटक है

<panel-item-list-action my-attr="item.myVal"></panel-item-list-action> 

इस घटक के लिए कोणीय मॉड्यूल घोषणा है: angular.module('Panel', []).component('panelItemListAction', ItemListAction)

Answer 1

टेम्पलेट्स डॉन $ स्कोप की जरूरत नहीं है। टेम्पलेट फ़ंक्शन HTML लौटाते हैं। आप हमेशा नियंत्रक में $ स्कोप इंजेक्ट कर सकते हैं।

module.component

हम घटक निर्देशों के पंजीकरण की एक और भी अधिक साधारण तरीका बनाया है:

यह वही है AngularJS ब्लॉग घटकों के बारे में कहते हैं। संक्षेप में, घटक विशेष प्रकार के निर्देश होते हैं, जो एक कस्टम तत्व (<my-widget></my-widget> जैसे कुछ) से जुड़े होते हैं, एक संबंधित टेम्पलेट और कुछ बाइंडिंग के साथ।

var myApp = angular.module("MyApplication", []) 
myApp.component("my-widget", { 
    templateUrl: "my-widget.html", 
    controller: "MyWidgetController", 
    bindings: { 
    title: "=" 
    } 
}); 

AngularJS 1.5 घटक विधि के बारे में अधिक जानने के लिए कृपया टोड पढ़ें: अब, AngularJS 1.5 में .component() विधि का उपयोग करके, आप एक पुन: प्रयोज्य घटक कोड के बहुत कुछ पंक्तियों से बना सकते हैं आदर्श वाक्य के लेख: http://toddmotto.com/exploring-the-angular-1-5-component-method/

- http://angularjs.blogspot.com/2015/11/angularjs-15-beta2-and-14-releases.html