本文介绍了使用带有angularjs引导崩溃的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想包括在我的角度应用下面的引导可折叠的面板。然而,当我点击展开,角度似乎看到的href =#collapseOne
,然后重定向到主页,而不是折叠面板。我的路由看起来是这样的,而且我觉得否则({redirectTo:'/家'});
引起的问题。有什么建议?
angular.module(应用)
的.config(['$ routeProvider',函数($ routeProvider){
$ routeProvider。
当('/用户',{templateUrl:'谐音/用户/用户list.html',控制器:'UserCtrl'})。
当('/用户/新',{templateUrl:'谐音/用户/用户new.html',控制器:'UserNewCtrl'})。
当('/用户/:用户ID',{templateUrl:'谐音/用户/用户detail.html',控制器:'UserDetailCtrl'})。
否则({redirectTo:'/家'});
}]);
面板 -
< DIV CLASS =面板组ID =手风琴>
< DIV CLASS =面板面板默认>
< DIV CLASS =面板标题>
< H4类=面板标题>
<一个数据切换=崩溃的数据父=#手风琴的href =#collapseOne>
扩大
&所述; / A>
< / H4>
< / DIV>
< DIV ID =collapseOne级=&GT面板崩溃崩溃;
< DIV CLASS =面板体>
...
< / DIV>
< / DIV>
< / DIV>
< / DIV>
解决方案
作为一个类似的问题Here,只需通过数据目标属性更改您的href
< DIV CLASS =面板组ID =手风琴>
< DIV CLASS =面板面板默认>
< DIV CLASS =面板标题>
< H4类=面板标题>
&所述; A HREF =JavaScript的:;数据切换=崩溃的数据父=#手风琴数据目标=#collapseOne>
扩大
&所述; / A>
< / H4>
< / DIV>
< DIV ID =collapseOne级=&GT面板崩溃崩溃;
< DIV CLASS =面板体>
...
< / DIV>
< / DIV>
< / DIV>
< / DIV>
I'm trying to include the below bootstrap collapsible panel in my angular application. However, when I click on "Expand", angular seems to see href="#collapseOne"
and then redirects to the home page instead of collapsing the panel. My routing looks like this, and I think the otherwise({redirectTo: '/home'});
is causing the problem. Any suggestions?
angular.module('App')
.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/users', {templateUrl: 'partials/users/user-list.html', controller: 'UserCtrl'}).
when('/users/new', {templateUrl: 'partials/users/user-new.html', controller: 'UserNewCtrl'}).
when('/users/:userid', {templateUrl: 'partials/users/user-detail.html', controller: 'UserDetailCtrl'}).
otherwise({redirectTo: '/home'});
}]);
The panel-
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
Expand
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
...
</div>
</div>
</div>
</div>
解决方案
As mentionned in a similar question Here, simply change your href by the data-target attribute
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a href="javascript:;" data-toggle="collapse" data-parent="#accordion" data-target="#collapseOne">
Expand
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
...
</div>
</div>
</div>
</div>
这篇关于使用带有angularjs引导崩溃的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!