AngularUI को AngularJS कैसे एकीकृत करें?

Question 1

मूर्खतापूर्ण प्रश्न के लिए क्षमा करें, क्या सभी जानते हैं कि AngularUI का उपयोग कैसे शुरू करें? मैंने इसे Github से डाउनलोड किया है और README में निर्देश पढ़ा है, लेकिन फिर भी समझ में नहीं आता कि मुझे क्या करना है।

Question 2

एकीकृत करने के लिए कदम:

JQuery और jQuery-ui शामिल करें (सीडीएन से सबसे अच्छी सेवा)
कोणीय शामिल करें (यदि सीडीएन से शामिल करना सबसे अच्छा है)
कोणीय-यूई जेएस / सीएसएस शामिल करें (वर्तमान में केवल buildफ़ोल्डर में गिटहब भंडार में होस्ट किया गया है )
आपके द्वारा उपयोग किए जा रहे निर्देशों के लिए किसी भी jQuery प्लगइन्स को शामिल करें
कोणीय-यूआई मॉड्यूल पर निर्भरता की घोषणा करें ( ui.directivesया ui.filtersजो आप उपयोग करने की योजना बना रहे हैं उसके आधार पर)।

उल्लिखित अधिकांश कदम जेएस / सीएसएस निर्भरता सहित बस के बारे में हैं। एकमात्र "मुश्किल" हिस्सा एक यूआई पर निर्भरता की घोषणा करना है। * मॉड्यूल, आप इसे इस तरह से कर सकते हैं:

var myApp = angular.module('myApp',['ui.directives']);

एक बार सभी निर्भरताएं शामिल हैं और एक मॉड्यूल कॉन्फ़िगर किया गया है जो आप जाने के लिए तैयार हैं। उदाहरण के लिए, यूआई-डेट निर्देश का उपयोग करना जितना आसान है (नोटिस ui-date):

<input name="dateField" ng-model="date" ui-date>

यहाँ पूरा jsField दिखा रहा है कि ui-date निर्देश का उपयोग कैसे करें: http://jsfiddle.net/r7UJ2/11/

तुम भी http://angular-ui.github.com/ के स्रोतों पर एक नज़र रखना चाह सकते हैं, जहाँ सभी निर्देशों से जीवंत उदाहरण हैं।

Question 3

मई 2013 की 3 तारीख़ तक, यहाँ चरण दिए गए हैं:

शामिल

    <script src="angular.min.js"></script>
    <script src="ui-bootstrap-tpls-0.3.0.min.js"></script>

ui पंजीकृत करें

    angular.module('myFancyApp', ['ui.bootstrap']);

सुनिश्चित करें कि myFancyAppआप के रूप में ही है<html ng-app="myFancyApp">

जादू शुरू करते हैं।

Question 4

मुझे लगता है कि जो गायब है वह प्लगइन्स है - आपको काम करने के लिए कुछ कोणीय-यूआई निर्देशों के लिए jquery प्लगइन स्क्रिप्ट और सीएसएस जोड़ना है। उदाहरण के लिए कोडमेकर निर्देश की जरूरत:

    <script src="http://codemirror.net/lib/codemirror.js" type="text/javascript"></script>
    <script src="http://codemirror.net/lib/util/runmode.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css" type="text/css" />

यह मेरे लिए आश्चर्य की बात है कि angular-ui.github.com प्लगइन्स को शामिल करने की आवश्यकता का उल्लेख नहीं करता है।

Question 5

नमस्ते, मैंने विशेष रूप से PHP सिंटैक्स हाइलाइटिंग के लिए यह करने के लिए एक लेख लिखा था। लेख यहाँ है: http://neverstopbuilding.net/how-to-integrate-codemirror-with-angular-ui/

चीजों का मूल विन्यास सही हो रहा है:

var myApp = angular.module('myApp', ['ui']);

myApp.value('ui.config', {
    codemirror: {
            mode: 'text/x-php',
        lineNumbers: true,
        matchBrackets: true
    }
});

function codeCtrl($scope) {
    $scope.code = '<?php echo "Hello World"; ?>';
}

निम्नलिखित HTML स्निपेट जैसी किसी चीज़ के लिए:

<div ng-app="myApp">
    <div ng-controller="codeCtrl">
        <textarea ui-codemirror ng-model="code"></textarea>
    </div>
</div>

आप यहाँ सेट के पूरे jsfiddle को देख सकते हैं: http://jsfiddle.net/jrobertfox/RHLfG/2/

pkozlowski.opensource सही है, और भी बहुत सी फाइलें हैं, जिन्हें आपको AngularUI प्रलेखन से लगता है कि इसमें शामिल करने की आवश्यकता है (यदि आप इसे दस्तावेज कह सकते हैं ...)

वैसे भी मुझे आशा है कि यह आपके या दूसरों के लिए उपयोगी है।

Question 6

निर्देश उनके सरकारी जीथब रिपॉजिटरी में readme.md फ़ाइल में हैं

कोणीय यूआई

वैकल्पिक रूप से, आप जिस तरीके से पता लगा सकते हैं कि कोणीय-यूआई जेएस फाइल को कैसे खोलें

angular.module("ui.bootstrap", [...deps...])

उपरोक्त कोड के आधार पर, आपको अपने मॉड्यूल में 'ui.bootstrap' इंजेक्ट करने की आवश्यकता है।

  angular.module('myFancyApp', ['ui.bootstrap','other_deps',.....]);