एक समारोह कॉल

Question

का परिणाम देख Angular.js वहाँ निम्नलिखित स्निपेट के साथ किसी भी प्रकट मुद्दा है:

<ul id="entry-name" class="breadcrumb"> 
     <li ng-repeat="dir in pathElements()" class="active"> 
      <span ng-show="!$last"> 
       &nbsp;<a href="#!?path={{dir.url}}">{{ dir.name }}</a>&nbsp;<span ng-show="!$first" class="dividier">/</span> 
      </span> 
     </li> 
     <li class="active">{{ pathElements()[pathElements().length - 1].name }}</li> 
    </ul> 

इस के साथ

JS:

$scope.pathElements = function() { 
     var retval = []; 
     var arr = $scope.currentPath().split('/'); 
     if (arr[0] == '') { 
      arr[0] = '/'; 
     } 

     var url = "/"; 
     retval.push({name: arr[0], url: url}); 
     for (var i = 1; i < arr.length; ++i) { 
      if (arr[i] != '') { 
       url += arr[i] + '/'; 
       retval.push({name: arr[i], url: url}); 
      } 
     } 
     return retval; 
    }; 

यह एक "त्रुटि के कारण किया जा रहा है: 10 $ पाचन() पुनरावृत्तियों तक पहुंचे। निरस्त! " त्रुटि, लेकिन मुझे यकीन नहीं है क्यों। क्या ऐसा इसलिए है क्योंकि pathElements() हर बार एक नई सरणी लौट रहा है? क्या इस से निकाल पाने के लिए कोई तरीका है?

Answer 1

हां, ऐसा इसलिए होता है क्योंकि आप हर बार एक नई सरणी लौट रहे हैं, और $ पाचन चक्र अनन्त रूप से लूप करता है (लेकिन कोणीय इसे समाप्त करता है)। आपको इसे फ़ंक्शन के बाहर घोषित करना चाहिए।

$scope.pathArray = []; 
$scope.pathElements = function() { 
    // retval becomes $scope.pathArray 
    if (weNeedToRecalcAllPathVariables) { 
    $scope.pathArray.length = 0; 
    // ... 
    } 

    // ... 
} 

हम बजाय एक नया बनाने के $scope.pathArray.length = 0 उपयोग करते हैं, लगातार फायरिंग यह से बचने के लिए।

आपको यह भी विचार करना चाहिए कि @ फ़्लेक सुझाव देता है। इस समारोह को केवल एक बार कॉल करें, उस समय जब आपको इसे पुन: गणना करने की आवश्यकता हो। और आप जो भी बांधते हैं वह सीधे $scope.pathArray से अधिक होना चाहिए।

आप इसे उपयोग करने से पहले अपने clenaning राज्य परीक्षण करने के लिए एक समारोह की जरूरत है, तो कम से कम मैं तुम्हें दो अलग-अलग कार्यों बनाने के लिए, बस इसे खुद निरुपण के साथ प्रत्येक कार्य रखने के लिए सुझाव देते हैं।

Answer 2

कोणीय में ब्रेडक्रंब को कार्यान्वित करने के तरीके के बारे में कुछ अच्छे संदर्भ के लिए angular-app प्रोजेक्ट (breadcrumbs service, how to use it) देखें।

यहां एक डेमो plunker है।