我是棱角分明的新人。我一直在尝试使用'ui.bootstrap'来实现bootstrap accordian。 如下所示在html中使用ng-repeat时动态调用工作正常。
<div ng-app="test-accordion">
<accordion>
<accordion-group
ng-repeat="group in groups"
heading="{{group.title}}"
is-open="group.anyOldValue">
{{group.content}}
<p ng-controller="LoadingController" isLoaded="{{isLoaded}}">IsLoaded: {{isLoaded}}</p>
</accordion-group>
</accordion>
</div>
当我像这样以静态方式尝试相同时
<div ng-app="test-accordion">
<accordion close-others="true" >
<accordion-group >
<accordion-heading ng-click="isopen=!isopen">
<div>
Test1
<i class="pull-right glyphicon" ></i>
</div>
</accordion-heading>
<div ng-controller="LoadingController" isLoaded="{{isLoaded}}">
Test cont1
<br/>IsLoaded: {{isLoaded}}
</div>
</accordion-group>
<accordion-group >
<accordion-heading ng-click="isopen=!isopen" >
<div >
Test2
<i class="pull-right glyphicon" ></i>
</div>
</accordion-heading>
<div ng-controller="LoadingController" isLoaded="{{isLoaded}}">
Test cont2
<br/> IsLoaded: {{isLoaded}}
</div>
</accordion-group >
</accordion>
</div>
'{{isLoaded}}'没有发生。我的模块控制器如下,
var app = angular.module('test-accordion', ['ui.bootstrap']);
function AccController($scope) {
$scope.oneAtATime = true;
$scope.groups = [
{
title: "Test1",
content: "Dynamic Group Body - 1",
anyOldValue: true
},
{
title: "Test2",
content: "Dynamic Group Body - 2",
anyOldValue: false
}
];
}
function LoadingController($scope, $timeout) {
$scope.$watch(
'group.anyOldValue',
function(value) {
if ( value && !$scope.isLoaded) {
console.log('loading...');
$timeout(function() {
// console.log('loaded');
$scope.isLoaded = '1';
}, 1000);
}
}
);
}
请告知为什么isLoaded不能使用静态手风琴?