gpt4 book ai didi

javascript - AngularJS - UI-Routing - 如何在 Controller 中使用路由状态作为变量?

转载 作者:塔克拉玛干 更新时间:2023-11-02 23:05:31 24 4
gpt4 key购买 nike

我正在使用 Angular JS 和 UI-Routing。路由工作正常。我的问题是根据用户所在的页面显示和隐藏 slider 。

我的 index.html 看起来像这样:

<body ng-app="myApp">

<header ng-include="'templates/header.html'"></header>
<div>Code for slider</div>


<!--=== Content Part ===-->
<div class="container">
<div class="row" >
<div ui-view autoscroll="false"></div>
</div>


</div><!--/container-->
<!-- End Content Part -->

<footer ng-include="'templates/footer.html'"></footer>

我的 app.js 看起来像这样:

angular
.module('myApp', ['ui.router'])
.config(['$urlRouterProvider','$stateProvider',function($urlRouterProvider,$stateProvider){
$urlRouterProvider.otherwise('/');
$stateProvider
.state('home',{
url: '/',
templateUrl: 'templates/home.html'
})
.state('about',{
url: '/about',
templateUrl: 'templates/about.html'
})
.state('contact',{
url: '/contact',
template: 'CONTACT'
})
}])
.controller()

现在我尝试将 slider 包含在 home.html 模板中,但由于初始化要求,它无法正常工作。当我在不同的 route 使用 Controller 时,它超出了范围。那么我如何将引用状态的变量传递给独立于路由的 Controller ,这样我就可以像这样使用它

if (state==home) {
$scope.showSlider==true;
}else{ $scope.showSlider==false;}

谢谢,

格德

更新:@克里斯T

我已将其添加到我的 app.js 中:

 .controller('myController',['$scope', '$state', function($scope,$state){
if ($state.includes('home')){
$scope.showIt=true;

}else{
$scope.showIt=false;
}
}])

然后我将 Controller 应用到一个 div 我包裹在 slider 上并使用

 ng-show="showIt"

最佳答案

将 $state 注入(inject)你的 Controller 。然后检查是否 $state.includes("home");

更新:我用一个父状态做了一个 plunk,它控制基于 $state.includes('main.home') 启用/禁用的 slider

http://plnkr.co/edit/eT1MW0IU53qfca6sGzOl?p=preview

关于javascript - AngularJS - UI-Routing - 如何在 Controller 中使用路由状态作为变量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24081376/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com