Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angularjs – 我怎样才能默认使用手风琴来打开第一个元素?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我在我的项目中使用bootstrap手风琴.

这是工作fiddler.

这是HTML代码

<div ng-app="myapp">
  <div ng-controller="AccordionDemoCtrl">
    <uib-accordion close-others="oneAtATime">
      <uib-accordion-group ng-repeat="group in groups" is-open="isOpen">
                      <uib-accordion-heading>
                    <div class="text-center">
                        <strong>{{group.titlE}}</strong>
                        <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': isOpen,'glyphicon-chevron-right': !isOpen}"></i>
                    </div>
                </uib-accordion-heading>
      {{group.content}}</uib-accordion-group>
    </uib-accordion>
  </div>
</div>

这是控制器:

var app = angular.module('myapp',['ui.bootstrap','ngAnimate'])

app.controller('AccordionDemoCtrl',function($scopE) {
  $scope.groups = [{
    title: "Dynamic Group Header - 1",content: "Dynamic Group Body - 1"
  },{
    title: "Dynamic Group Header - 2",content: "Dynamic Group Body - 2"
  },{
    title: "Dynamic Group Header - 3",content: "Dynamic Group Body - 3"
  }];
});

我试着用这一行:

is-open="true"

像那样:

<uib-accordion-group heading="{{group.titlE}}" ng-repeat="group in groups"  is-open="true">{{group.content}}</uib-accordion-group>

但它认打开所有项目.

我怎么能认使用手风琴才能打开第一个元素?

附:这是更新plunker

解决方法

请使用$first of ng-repeat指令仅打开第一个手风琴,如is-open =“$first”

标记

<uib-accordion close-others="oneAtATime">
  <uib-accordion-group heading="{{group.titlE}}" 
     ng-repeat="group in groups" 
     is-open="$first">
       {{group.content}}
  </uib-accordion-group>
</uib-accordion>

Preview Here

大佬总结

以上是大佬教程为你收集整理的angularjs – 我怎样才能默认使用手风琴来打开第一个元素?全部内容,希望文章能够帮你解决angularjs – 我怎样才能默认使用手风琴来打开第一个元素?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。