Latest web development tutorials

علامة التبويب الأيونية عملية شريط

ايون علامات التبويب

ايون علامات التبويب هي مجموعة من علامات تبويب الصفحات في شريط التبويب. يمكنك التبديل صفحات من خلال النقر على هذا الخيار.

لدائرة الرقابة الداخلية، وسوف تظهر في الجزء السفلي من الشاشة، وسوف تظهر الروبوت في الجزء العلوي من الشاشة (أسفل شريط الملاحة).

استعمال 

<ion-tabs class="tabs-positive tabs-icon-only">

  <ion-tab title="首页" icon-on="ion-ios7-filing" icon-off="ion-ios7-filing-outline">
    <!-- 标签 1 内容 -->
  </ion-tab>

  <ion-tab title="关于" icon-on="ion-ios7-clock" icon-off="ion-ios7-clock-outline">
    <!-- 标签 2 内容 -->
  </ion-tab>

  <ion-tab title="设置" icon-on="ion-ios7-gear" icon-off="ion-ios7-gear-outline">
    <!-- 标签 3 内容 -->
  </ion-tab>

</ion-tabs>

والنتيجة هي كما يلي:

API

ممتلكات نوع التفاصيل
مندوب مقبض
(اختياري)
字符串

المقبض مع $ionicTabsDelegate لتحديد علامات التبويب هذه.

ايون التبويب

تابع ionTabs

أنه يحتوي على محتوى التبويب. هذا المحتوى موجود فقط في علامة التبويب المحددة معين.

كل لديه ionTab تاريخ التصفح الخاص بها.

استعمال 

<ion-tab
  title="Tab!"
  icon="my-icon"
  href="#/tab/tab-link"
  on-select="onTabSelected()"
  on-deselect="onTabDeselected()">
</ion-tab>

API

ممتلكات نوع التفاصيل
لقب 字符串

عنوان التبويب.

أ href
(اختياري)
字符串

ولكن عندما كنت على اتصال سوف علامة التبويب القفز الروابط.

رمز
(اختياري)
字符串

علامة التبويب رمز. إذا كانت قيمة معينة، يصبح الافتراضي أيون على والأيوني قبالة.

رمز على
(اختياري)
字符串

اختيار رمز العلامة.

رمز حالا
(اختياري)
字符串

لم يتم تحديد رمز العلامة.

شارة
(اختياري)
表达式

علامة التبويب شارة (عادة عددا).

على غرار شارة
(اختياري)
表达式

أساليب التبويب الصغرى كاب (على سبيل المثال، علامات إيجابية).

على حدد
(اختياري)
表达式

حرائق عند علامة التبويب المحددة.

على إلغاء تحديد
(اختياري)
表达式

تحريك علامة التبويب عندما لم يتم التحقق منه.

نانوغرام النقر
(اختياري)
表达式

عادة، وسيتم اختيار علامة التبويب عند النقر عليها. إذا كان نانوغرام مزدوجا فوق، لن يتم تحديده. يمكنك استخدام $ ionicTabsDelegate.select () لتحديد تسمية التبديل.

$ IonicTabsDelegate

إذن ionTabs تحكم التعليمات.

هذه طريقة الاتصال مباشرة خدمة $ ionicTabsDelegate، السيطرة على جميع ionTabs التعليمات. مع طريقة $ getByHandle من السيطرة على سبيل المثال ionTabs محددة.

استعمال 

<body ng-controller="MyCtrl">
  <ion-tabs>

    <ion-tab title="Tab 1">
      你好，标签1！
      <button ng-click="selectTabWithIndex(1)">选择标签2</button>
    </ion-tab>
    <ion-tab title="Tab 2">你好标签2！</ion-tab>

  </ion-tabs>
</body>

function MyCtrl($scope, $ionicTabsDelegate) {
  $scope.selectTabWithIndex = function(index) {
    $ionicTabsDelegate.select(index);
  }
}

الطريق 

select(index, [shouldChangeHistory])

حدد علامة التبويب لتتناسب مع مؤشر معين.

المعلمات نوع التفاصيل
مؤشر 数值

حدد علامة التبويب فهرس.

shouldChangeHistory
(اختياري)
布尔值

إذا كان هذا الخيار يجب تحميل تصفح التاريخ من هذه العلامة (إن وجدت)، واستخدام، أو تحميل فقط على الصفحة الافتراضية. الافتراضي هو زائف. نصيحة: إذا كان ion-nav-view في بطاقة الخيار، قد تحتاج إلى تعيين إلى true. 

selectedIndex()

يتم تحديد قيمة مؤشر العلامة، مثل-1: عودة القيمة.

$getByHandle(handle)
المعلمات نوع التفاصيل
مقبض 字符串

على سبيل المثال: 

$ionicTabsDelegate.$getByHandle('my-handle').select(0);