2013-11-27 16 views
8

CSS से मोबाइल अनुकूल तरीके से AngularJS एप्लिकेशन को स्टाइल करने की अन्य संभावनाएं हैं?कोणीयजेएस + jQuery मोबाइल

मैं एक मोबाइल ऐप की योजना बना रहा हूं और तर्क और डेटा बाइंडिंग के लिए एंगुलरजेएस का उपयोग करना चाहता हूं लेकिन मैं CSS के साथ अपने आप सबकुछ स्टाइल नहीं करना चाहता हूं।

AngularJS पूछे जाने वाले प्रश्न कहना है कि यह jQuery उपयोग करता है:

कोणीय उपयोग jQuery पुस्तकालय है? हां, कोणीय jQuery का उपयोग कर सकता है यदि यह आपके ऐप में मौजूद है जब एप्लिकेशन बूटस्ट्रैप किया जा रहा है। यदि jQuery आपके स्क्रिप्ट पथ में मौजूद नहीं है, तो कोणीय jQuery के उप-समूह के अपने कार्यान्वयन पर वापस आ जाता है जिसे हम jQLite कहते हैं।

बाइंड()/unbind() के बजाय()/off() पर उपयोग करने के लिए परिवर्तन के कारण, कोणीय 1.2 केवल jQuery 1.7.1 या उससे ऊपर के साथ संचालित होता है।

लेकिन एफएक्यू में कोई जानकारी नहीं मिली है जिस पर AngularJS + jQuery का उपयोग किया जा सकता है।

जैसा कि आप देख सकते हैं कि मैंने AngularsJS FAQ का उपयोग करके जानकारी प्राप्त करने का प्रयास किया है, लेकिन इसे नहीं मिला।

क्या आपको AngularJS के कुछ उदाहरण उदाहरण हैं jQuery Mobile स्टाइल के लिए?

+1

आप दोनों को जोड़ सकते हैं। – Omar

+0

कोणीय जेएस ऐसी शैलियों को प्रदान नहीं करता है, आदर्श रूप से आपको jquery मोबाइल के साथ एंजुलरज को गठबंधन नहीं करना चाहिए, मेरी सबसे अच्छी सिफारिश बूटस्ट्रैप –

+0

ट्रूवर के उत्तरदायी डिज़ाइन के साथ कोणीय का उपयोग करेगी - कृपया एक पोस्ट में कई प्रश्न पूछें। यदि आप कामकाजी संयोजन के उदाहरणों के बारे में पूछें तो यह पर्याप्त होगा यदि कोणीय + jQuery मोबाइल – MikroDel

उत्तर

4

AngularJS और jQuery Mobile की तुलना करने के लिए SO पर पहले से ही सवाल था।

और answer में आप कुछ जानकारी पा सकते हैं - यह आपके लिए और अधिक पढ़ना है।

और आर्कटिकल jQuery Mobile and AngularJS Working Together आपको अपने प्रश्न का उत्तर देना चाहिए। यह कुछ सलाह, उदाहरण के लिए: AngularJS

या

से पहले

लोड jQM libs jQM यूआरएल मार्ग

आदि

3

संभाल करते हैं एक बहुत ही बुनियादी उदाहरण:

एचटीएमएल:

<body ng-app='myApp'> 
    <div data-role="page" ng-controller='myCtrl'> 
     <ul data-role="listview"> 
      <li ng-repeat='car in cars'><a href="{{car}}.html">{{car}}</a> 

      </li> 
     </ul> 
    </div> 
</body> 

js:

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

app.controller('myCtrl', function ($scope) { 
    $scope.cars = [ 
     'acura', 'audi', 'BMW' 
    ]; 
}); 

काम कर डेमो: http://jsfiddle.net/eZdNm/

jQuery मोबाइल और AngularJS के साथ मुख्य समस्या यह है कि वे दोनों पेज मार्ग को नियंत्रित करना चाहते है। आप Google में सर्चिंग jQuery मोबाइल और कोणीय द्वारा अधिक जानकारी प्राप्त कर सकते हैं।

हां, अगर आप केवल मोबाइल/मोबाइल अनुकूल यूआई के लिए तैयार होना चाहते हैं।मैं बूटस्ट्रैप जैसे अन्य सीएसएस आधारित ढांचे का सुझाव दूंगा।

+0

मैंने आपके कोड का परीक्षण किया है और यह काम करता है, लेकिन जब मैं एक नई कार जोड़ने के लिए एक फॉर्म जोड़ रहा हूं यह काम नहीं करता है (देखें [लिंक] (http://jsfiddle.net/T7WYg/))। क्या यह सामान्य व्यवहार है? – sgalenski

+0

अद्यतन देखें http://jsfiddle.net/T7WYg/7/ –