कोणीय नियंत्रकों के अंदर अंडरस्कोर का उपयोग करें


126

मैं angularjs नियंत्रकों के अंदर अंडरस्कोर लाइब्रेरी का उपयोग कैसे करूं?

इस पोस्ट पर: AngularJS limitTo द्वारा पिछले 2 रिकॉर्ड्स में किसी ने rootScope को _ वैरिएबल असाइन करने का सुझाव दिया है ताकि लाइब्रेरी ऐप के भीतर सभी स्कोप्स को उपलब्ध हो जाए।

लेकिन मुझे यह स्पष्ट नहीं है कि यह कहां करना है। मेरा मतलब है कि यह ऐप मॉड्यूल घोषणा पर जाना चाहिए? अर्थात:

var myapp = angular.module('offersApp', [])
            .config(['$rootScope', function($rootScope) { }

लेकिन फिर मैं अंडरस्कोर लिब को कहां से लोड करूं? मुझे बस अपने इंडेक्स पेज पर एनजी-ऐप निर्देश और स्क्रिप्ट संदर्भ दोनों कोणीय-जेएस और अंडरस्कोर लिब के लिए है?

index.html:

<head>
</head>
<body ng-app="offersApp">
...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="scripts/vendor/angular.js"></script>
<script src="scripts/vendor/underscore.js"></script>
...  

मुझे यह कैसे हासिल होगा?


अच्छा तुमने क्या किया और क्या काम नहीं किया?
mpm

खैर, मुझे नहीं पता कि कहाँ से शुरू किया जाए। मैं <स्क्रिप्ट> फ़ाइलों के किसी भी राजा को कोणीय भाग के साथ कैसे जोड़ूं? (नियंत्रकों, सेवाओं, निर्देशों ... आदि)। क्या अभिव्यक्ति की तरह कोई आवश्यकता ('...') है?
पाब्लो

बस अपने HTML फ़ाइल में अंडरस्कोर के साथ उचित स्क्रिप्ट टैग घोषित करें, जैसे आपने कोणीय या jquery के साथ किया था।
mpm

क्या यह स्वतः ही _ चरित्र के तहत उपलब्ध होगा ?? किस तरह??
पाब्लो

जवाबों:


231

जब आप अंडरस्कोर को शामिल करते हैं, तो यह स्वयं को windowऑब्जेक्ट से जोड़ता है , और इसलिए यह विश्व स्तर पर उपलब्ध है।

तो आप इसे कोणीय कोड के रूप में उपयोग कर सकते हैं।

आप इसे किसी सेवा या कारखाने में भी लपेट सकते हैं, यदि आप इसे इंजेक्ट करना चाहते हैं:

var underscore = angular.module('underscore', []);
underscore.factory('_', ['$window', function($window) {
  return $window._; // assumes underscore has already been loaded on the page
}]);

और फिर आप _अपने ऐप के मॉड्यूल के लिए पूछ सकते हैं :

// Declare it as a dependency of your module
var app = angular.module('app', ['underscore']);

// And then inject it where you need it
app.controller('Ctrl', function($scope, _) {
  // do stuff
});

27
मुझे समझ नहीं आ रहा है कि जब आप पहले से ही वैश्विक विंडो दायरे में हैं तो आप इसे क्यों इंजेक्ट करेंगे।
वाल्टर स्टबोसज़

36
संभवत: उन्हीं कारणों से आप कुछ भी इंजेक्ट करते हैं, वैश्विक दायरे में सब कुछ डालने के बजाय। हालाँकि, जब आप कुछ अन्य विशिष्ट निर्भरता की तुलना में परीक्षण के दौरान अपने अंडरस्कोर लाइब्रेरी को स्थानापन्न करना चाहते हैं, तो यह समझने योग्य है कि यह आवश्यक नहीं लगता है।
डर।

50
जब आप अपनी फ़ाइल में 'कड़ाई का उपयोग' जोड़ते हैं, तो यह आवश्यक है। चूँकि अंडरस्कोर / लॉश को परिभाषित नहीं किया गया है, यह संदर्भ फेंक देगा: _ परिभाषित नहीं किया गया है ... आपको इसे इंजेक्ट करना होगा, या विंडो का उपयोग करना होगा ।_
Shanimal

23
हा! मैं इंजेक्शन लगाना चाहता था क्योंकि यह शांत है, मुझे एक वास्तविक कारण देने के लिए धन्यवाद, @ शांमल।
आदित्य एमपी

10
आप परीक्षण के लिए _ इंजेक्ट करना भी चाह सकते हैं। आप अंडरस्कोर निर्भरता को एक परीक्षण सूट के माहौल में लाने के बारे में कैसे जाएंगे
sunwukung

32

मैंने यहाँ @ satchmorun का सुझाव लागू किया है: https://github.com/andresesfm/angular-underscore-module

इसके प्रयेाग के लिए:

  1. सुनिश्चित करें कि आपने अपनी परियोजना में अंडरस्कोर शामिल किया है

    <script src="bower_components/underscore/underscore.js">
  2. उसे ले लो:

    bower install angular-underscore-module
  3. अपनी मुख्य फ़ाइल (index.html) में कोणीय-अंडरस्कोर-मॉड्यूल जोड़ें।

    <script src="bower_components/angular-underscore-module/angular-underscore-module.js"></script>
  4. मॉड्यूल को अपनी ऐप परिभाषा में निर्भरता के रूप में जोड़ें

    var myapp = angular.module('MyApp', ['underscore'])
  5. उपयोग करने के लिए, अपने नियंत्रक / सेवा में एक इंजेक्शन की निर्भरता के रूप में जोड़ें और यह उपयोग करने के लिए तैयार है

    angular.module('MyApp').controller('MyCtrl', function ($scope, _) {
    ...
    //Use underscore
    _.each(...);
    ...
    

काम करने के लिए प्रकट नहीं होता है। मुझे एक अपरिभाषित त्रुटि मिलती है:Uncaught ReferenceError: _ is not defined
chovy

मैंने स्पष्टीकरण जोड़ा: आपको अंडरस्कोर शामिल करना होगा। जेएस यह कनेक्टर आपको केवल एक सेवा में इसका उपयोग करने में मदद करता है। @ Satchmorun का उत्तर देखें
एकजुट करें

31

मैं इसका उपयोग करता हूं:

var myapp = angular.module('myApp', [])
  // allow DI for use in controllers, unit tests
  .constant('_', window._)
  // use in views, ng-repeat="x in _.range(3)"
  .run(function ($rootScope) {
     $rootScope._ = window._;
  });

Https://github.com/angular/angular.js/wiki/Understand-D dependency-Injection के बारे में कुछ और जानकारी के लिए आधे रास्ते के बारे में देखें run


यह अच्छा लग रहा है लेकिन क्या आपके पास एक उदाहरण है? मुझे केवल प्रथम अक्षर का उपयोग करके सभी अपरकेस को ऊपरी में बदलने की आवश्यकता है केवल _.capitalize ()
Nate

2
मुझे लगता है कि यह काम करना चाहिए <p>{{ _.capitalize('lalala') }}</p>?
तारों

1
@Larayut मुझे नहीं पता, यह कोशिश क्यों नहीं? (मैं तब से ReactJS में चला गया हूं)
तार

कृपया इसके बजाय सेवा का उपयोग करें। अपने $ rootScope में सामान जोड़ने से बचें, इससे आपको बेहतर प्रदर्शन करने में मदद मिलेगी।
टिम हांग

निश्चित नहीं है कि मैंने क्या गलत किया, लेकिन मुझे काम में "विचारों में उपयोग" नहीं मिला। लेकिन सेवा को नियंत्रक और फिर $ ctrl कार्यों के माध्यम से tpl में पास करना।
ओलिववव

3

आप इस मॉड्यूल पर कोणीय के लिए भी देख सकते हैं

https://github.com/floydsoft/angular-underscore


आप इस चीज़ को एक नियंत्रक में कैसे लोड करते हैं?
चॉवी

3
मैं हमेशा उन मॉड्यूलों के बारे में चिंता करता हूं जो वर्षों से अपडेट नहीं किए गए हैं
ताहिर खालिद

1

अगर आपको लॉश का उपयोग करने में कोई आपत्ति नहीं है, तो https://github.com/rockabox/ng-lodash इसे पूरी तरह से दर्ज करें, ताकि यह एकमात्र निर्भरता हो और आपको किसी अन्य स्क्रिप्ट फ़ाइलों को लोड करने की आवश्यकता न हो।

लोदश पूरी तरह से खिड़की के दायरे से दूर है और कोई "उम्मीद" नहीं है कि इसे आपके मॉड्यूल से पहले लोड किया गया है।


हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.