2014-09-25 61 views
1

我的手风琴没有开放。我最初认为这是由于ng-view导致的,因为有许多bug报告。我试过these解决方案的both,但似乎并不像标签导致问题。我还将手风琴移到了ng-view之外,他们仍然没有开放。Angular-UI-Bootstrap手风琴不开放

我使用自举3和角UI的自举tmpls.0.11.0.js

我的应用:

angular 
    .module('App', [ 
    'ngRoute', 
    'templates', 
    'ui.bootstrap.tpls', 
    'ui.bootstrap', 
    ]) 

.config(function ($routeProvider, $locationProvider) { 
    $routeProvider 
    .when('/doctor', { 
     templateUrl: 'doctor_profile.html', 
     controller: 'DoctorCtrl' 
    }) 
$locationProvider.html5Mode(true); 
}) 

doctor_profile.html:

<accordion close-others="oneAtATime"> 
    <accordion-group ng-repeat="doctor in doctors"> 

    <accordion-heading> 
     <span>{{doctor.name}} </span> 
    </accordion-heading> 
      {{ doctor.type }} 
    </accordion-group> 
</accordion> 

和最后我的控制器

.controller('DoctorCtrl', function($scope) { 
    $scope.oneAtATime = false; 

    $scope.doctors = [ 
     { 
     name: 'Dr. Bob ', 
     type: 'Orthopedic Surgery', 
     }, 
     { 
     name: 'Dr. Ted', 
     type: 'Pediatritian', 
     }, 

    $scope.status = { 
     isFirstOpen: true, 
     isFirstDisabled: false 
    }; 

回答

3

你需要手风琴是开性绑定如下:

<accordion-group ng-repeat="doctor in doctors" is-open="status.isItemOpen[$index]"> 

,并在控制器

$scope.status = { 
     isItemOpen: new Array($scope.doctors.length), 
     isFirstDisabled: false 
    }; 

$scope.status.isItemOpen[0] = true; 

打开第一组(只是一个例子)和

$scope.status.isItemOpen[0] = false; 

关闭第一组。

致以问候

+0

这似乎不是问题。这只是打开所有手风琴,然后你仍然无法关闭它们。 – user2954587 2014-09-25 13:28:36

+0

您需要为每个手风琴组使用一个单独的绑定属性。你做一个ng-repeat,这意味着每个组都绑定到你的控制器的$ scope.isFirstOpen属性。这就是为什么他们全部开放。只是改变了例子。 – Dansen 2014-09-25 14:19:42