एंगुलर 2 प्रोजेक्ट

Question

से एंगुलरजेएस (कोणीय 1) मॉड्यूल का उपयोग करें, बस एंगुलर 2 प्रोजेक्ट (एंगुलर 1/एंगुलरजेएस के साथ कोई पिछला अनुभव नहीं है। ऑनलाइन क्विकस्टार्ट और ट्यूटोरियल्स से आगे बढ़ाया गया है, और सब ठीक था। हालांकि मैं बिंदु पर हूं जहाँ मैं एक पुस्तकालय जो AngularJS लिए बनाया गया है से कुछ घटकों का उपयोग करना चाहते हैं, और समस्याओं का कोई अंत नहीं होने!

जानकारी AngularJS के बारे में उपलब्ध में से अधिकांश/Angular2 अनुकूलता मान लिया गया है कि आप एक AngularJS परियोजना है कि आप जोड़ रहे है कोणीय 2 घटकों के लिए - दूसरी तरफ नहीं - तो मैं जो भी करने की उम्मीद कर रहा हूं वह भी संभव नहीं हो सकता है। मैंने अभी तक जो कोशिश की है, वह एक कोणीय 2 क्विकस्टार्ट के आधार पर एक सरल स्ट्रिप-बैक प्रोजेक्ट शामिल है, जिसमें एक सिंगुलर 2 घटक है index.html में लोड होता है। मैं फिर चाहूंगा मौजूदा पुस्तकालय (AngularJS- आधारित) से घटकों को ntegrate।

• मैं पुस्तकालय से घटक बना सकते हैं और उन्हें अपने Angular2 घटक में सीधे जोड़ने के लिए UpgradeAdapter.upgradeNg1Component का उपयोग कर की कोशिश की है

• मैं NPM के माध्यम से AngularJS स्थापित करने की कोशिश की है, मेरे index.html में एक स्क्रिप्ट टैग में आयात और फिर UpgradeAdapter.downgradeNg2Component और UpgradeAdapter.bootstrap के संयोजन का उपयोग डाउनग्रेड मॉड्यूल

इनमें से न तो के रूप में मेरे Angular2 लोड करने के लिए काम करने के लिए लग रहे हैं - घटक टी विफल रहता है ओ शो, और ब्राउज़र कंसोल मुझे बताता है कि मुझे Uncaught SyntaxError: Unexpected token < Evaluating http://localhost:3000/angular2/upgrade Error loading http://localhost:3000/app/main.js

इस समय मेरा सबसे अच्छा अनुमान यह है कि यह वास्तव में एक असमर्थित परिदृश्य है, और मुझे उपयोग करने के लिए 'उचित' AngularJS ऐप होना चाहिए Angular2 से UpgradeAdapter कार्यक्षमता। क्या कोई इसकी पुष्टि कर सकता है? या क्या कुछ बेवकूफ है मैं यहाँ याद कर रहा हूँ?

• http://plnkr.co/edit/yMjghOFhFWuY8G1fVIEg?p=preview

एक महत्वपूर्ण बात UpgradeAdapter पर bootstrap अपने मुख्य घटक के लिए है:

Answer 1

इसलिए इस मामले में बड़ी समस्या यह तथ्य साबित हुई कि ऐसा लगता है कि अपग्रेड घटकों को भाग ओ के रूप में शामिल नहीं किया गया है मूल कोणीय 2 बंडल एफ। जोड़ने के बाद:

<script src="node_modules/angular2/bundles/upgrade.min.js"></script>

मेरी index.html फ़ाइल को

त्रुटि मैं गायब देख रहा था।

सही दिशा में मुझे इंगित करने के लिए उत्तर here उत्तर के लिए धन्यवाद!

Answer 2

यहाँ Angular1 और Angular2 तत्वों मिश्रण करने के लिए कैसे का वर्णन plunkr एक काम है। इस तरह से सभी तत्वों प्रदाताओं (सेवाओं/कारखानों) में और निर्देशों में उपलब्ध हैं (घटकों/निर्देशों):

upgrade.bootstrap(document.body, ['heroApp']); 

इन दो जवाब तुम्हारी मदद कर सकता:

• angular 1.x and angular2 together
• How to inject upgraded Angular 1 service/factory to Angular 2 component in ES5?