Angular.js: الوالد $ index. فقد $ index عند استخدام ng-if

تم إنشاؤها على ١٠ سبتمبر ٢٠١٥  ·  3تعليقات  ·  مصدر: angular/angular.js

كود HTML الخاص بي

 <div>
 <ul>
 <li ng-تكرار = 'parentItem in arr1'>
 <div ng-تكرار = 'childItem in arr2'>
 {{parent. $ index}} ، {{$ index}}
 </div>
 </li>
 </ul>
 </div>

كود جافا سكريبت داخل وحدة التحكم

 $ نطاق .arr1 = [1،2] ؛
 $ نطاق .arr2 = [1،2] ؛

هذا الرمز يعطيني الإجابة الصحيحة

 0 ، 0
 0 ، 1
 1 ، 0 ،
 1 ، 1

ولكن إذا استخدمت ng-if="true" في حلقة الطفل ، فهذا يعطيني إجابة خاطئة

 <div>
 <ul>
 <li ng-تكرار = 'parentItem in arr1'>
 <div ng-تكرار = 'childItem in arr2' ng-if = "true">
 {{parent. $ index}} ، {{$ index}}
 </div>
 </li>
 </ul>
 </div>
 0 ، 0
 1 ، 1
 0 ، 0
 1 ، 1

كان هذا خطأ. يتم تغيير الفهرس الأصل إلى فهرس فرعي

الرجاء إصلاح هذه المشكلة

التعليق الأكثر فائدة

هذه ليست مشكلة في Angular. يحدث هذا ( كما هو موثق ) ، لأن ngIf ينشئ نطاقًا جديدًا ، لذلك لا يشير $parent إلى نطاق ngRepeat الخارجي.

هذا هو السبب في أن استخدام $parent ليس ممارسة جيدة هنا. يمكنك / يجب عليك استخدام ngInit لإنشاء اسم مستعار للفهرس الرئيسي ، مثل هذا:

<li ng-repeat="parentItem in arr1" ng-init="parentIdx = $index">
  <div ng-repeat="childItem in arr2" ng-if="true">
    {{ parentIdx }} , {{ $index }}
  </div>
</li>

تجريبي

ال 3 كومينتر

هذه ليست مشكلة في Angular. يحدث هذا ( كما هو موثق ) ، لأن ngIf ينشئ نطاقًا جديدًا ، لذلك لا يشير $parent إلى نطاق ngRepeat الخارجي.

هذا هو السبب في أن استخدام $parent ليس ممارسة جيدة هنا. يمكنك / يجب عليك استخدام ngInit لإنشاء اسم مستعار للفهرس الرئيسي ، مثل هذا:

<li ng-repeat="parentItem in arr1" ng-init="parentIdx = $index">
  <div ng-repeat="childItem in arr2" ng-if="true">
    {{ parentIdx }} , {{ $index }}
  </div>
</li>

تجريبي

راجع للشغل ، هذا سؤال دعم عام. من الأفضل توجيه مثل هذه الأسئلة إلى القنوات المناسبة .
يتم حجز مشكلات GitHub لتقارير الأخطاء وطلبات الميزات.

شكرا،

يمكنني استخدام هذا بواسطة ng-init

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات