Angularjs 以角度显示/隐藏基于路由的内容，仅在刷新后有效_Angularjs_Angular Ui Router_Ng Show

Angularjs 以角度显示/隐藏基于路由的内容，仅在刷新后有效

angularjs

Angularjs 以角度显示/隐藏基于路由的内容，仅在刷新后有效,angularjs,angular-ui-router,ng-show,Angularjs,Angular Ui Router,Ng Show,我有一个页眉+页脚，我不想在登录（语言）页面上显示。这是可行的，但只有在刷新之后。解决这个问题的最佳做法是什么以下是我得到的： <div ng-include= " 'includes/header.html ' " ng-show="{{currentPage != '/language'}}"> 注意：这还没有完全发挥作用我如何在不需要刷新的情况下使其工作？是否需要将其放入.run函数中？它只分配一次值，您应该注意更改或使用方法返回值 <div ng-include

我有一个页眉+页脚，我不想在登录（语言）页面上显示。这是可行的，但只有在刷新之后。解决这个问题的最佳做法是什么

以下是我得到的：

<div ng-include= " 'includes/header.html ' " ng-show="{{currentPage != '/language'}}">

注意：这还没有完全发挥作用

我如何在不需要刷新的情况下使其工作？

是否需要将其放入.run函数中？

它只分配一次值，您应该注意更改或使用方法返回值

<div ng-include="'includes/header.html'" ng-show="{{!isCurrentPage('/language')}}">

解决方案：

车身上的控制器

<body ng-controller="routeCtrl">

因此，现在标题没有包含在语言页面上。

这是迄今为止我找到的最佳解决方案

app.js

var app = angular.module('app', ['ui.router']);

app.config(function($stateProvider, $urlRouterProvider, $locationProvider) {
    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            template: "<h1>Home</h1>"
        })
        .state('contact', {
            url: '/contact',
            template: "<h1>Contact</h1>"
        });
});

app.run(function($rootScope, $state, $location, $timeout) {
    $rootScope.$on('$stateChangeSuccess', function(event, toState){

        $rootScope.showInclude = true;

        if($state.current.name === 'contact') {
            $rootScope.showInclude = false;
        }
    });
});

var-app=angular.module（'app'，['ui.router']）；
app.config（函数（$stateProvider、$urlRouterProvider、$locationProvider）{
$urlRouterProvider。否则（'/'）；
$stateProvider
.州（“家”{
url:“/”，
模板：“主页”
})
.州（“联系人”{
url:“/contact”，
模板：“联系人”
});
});
运行（函数（$rootScope、$state、$location、$timeout）{
$rootScope.$on（“$stateChangeSuccess”，函数（事件，toState）{
$rootScope.showInclude=true；
如果（$state.current.name=='contact'）{
$rootScope.showInclude=false；
}
});
});

您的包括

<div ng-include="'include.html'" ng-if="showInclude"></div>

您可以使用

isState

或

includedByState

过滤器来处理视图中的所有内容。

可能就是这样，谢谢。我应该把isCurrentPage函数放在哪里，以便每次都执行它？在homeCtrl或languageCtrl中，它不会被执行。我要回答的是，您应该显示更多的代码。你能展示一下你的html和控制器代码吗。在哪里分配控制器？我使用ui路由器$stateProvider分配控制器，我添加了一些$stateProvider代码。我认为问题在于这些控制器只能在相应的页面视图上执行。我是否需要在每次执行的代码中都有一个位置？“”在哪个视图中？啊，我看你已经设法解决了：）是的，不过谢谢你的建议。我的解决方案可行，但我不确定什么是最佳实践/性能。

<div ng-include=" 'includes/header.html ' " ng-show="!state.includes('language')"></div>

 .controller('routeCtrl', ['$scope', '$location', '$state', function($scope, $location, $state) {
    $scope.state = $state;
 }]);`

var app = angular.module('app', ['ui.router']);

app.config(function($stateProvider, $urlRouterProvider, $locationProvider) {
    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            template: "<h1>Home</h1>"
        })
        .state('contact', {
            url: '/contact',
            template: "<h1>Contact</h1>"
        });
});

app.run(function($rootScope, $state, $location, $timeout) {
    $rootScope.$on('$stateChangeSuccess', function(event, toState){

        $rootScope.showInclude = true;

        if($state.current.name === 'contact') {
            $rootScope.showInclude = false;
        }
    });
});

<div ng-include="'include.html'" ng-if="showInclude"></div>