“ng-class”不适用于来自包含模板的功能调用



>我有我的主模板叫home.html,控制器homeController应用抛出: $routeProvider

$routeProvider
    .when ("/", {
        templateUrl : "views/home.html",
        controller  : "homeController"
});
$routeProvider
    .otherwise ({
        redirectTo:'/'
});

工作正常。我有单独的html模板header' which included in the.html像这样:

<div class="content">
    <ng-include src="'/views/header.html'"></ng-include>
    <div class="globe">
        <div class="progName">
            <div class="swiper"></div>
            <h2 class="active">
                <span class="title">
                    {{activeApp.name}}
                </span>
                <span class="note">{{activeApp.note}}</span>
            </h2>
            <h2 class="que t{{$index+1}}" ng-click="activate(app)" ng-repeat="app in queApp">{{app.name}}</h2>
        </div>

对于header,我有单独的controller称为"header.js which is included in the index.html"文件。

<script src="app.js"></script>
    <script src="js/script/factory/server.js"></script>
    <script src="js/script/controllers/header.js"></script>
    <script src="js/script/controllers/homeController.js"></script>
    <script src="js/script/directives/home/programNames.js"></script>

在标题中,有一个类,我想有条件地应用,所以我在header.html文件(包含)中添加了条件

header.js(headerController)中,我正在尝试添加条件类,但不起作用:

我的标题.js:

angular.module("tcpApp")
    .controller('header', ['$scope', function ($scope) {
        $scope.show = false;
        $scope.menuHandler = function () {
            $scope.show = !$scope.show;
            console.log("i am called");
        }
    }]);

我在这里缺少什么? 我添加controller的方式是错误的? 或者我需要在父控制器homeController本身编写函数?

我不能为标题保留单独的控制器并包含在其他模板中吗?

安迪一个帮我处理?提前谢谢。

更新标题 html :

<header ng-controller="header" >
    <h1><a href="#">TCP</a></h1>
    <nav>
        <a class="menu" ng-click="menuHandler()" href="#">Menu</a>
        <span ng-class="{'activate':show}">
            <a href="#"><span>All</span></a>
            <a href="#"><span>Important</span></a>
            <a href="#"><span>Design</span></a>
            <a href="#"><span>Supply</span></a>
            <a href="#"><span>Contruction</span></a>
            <a href="#"><span>Issue Log</span></a>
        </span>
    </nav>
</header>

在家里尝试这样的事情.html :

<div class="content">
    <ng-include src="views/header.html"></ng-include>
    //code here
</div>

删除标头.html模板路径开头的"/"。

我想这应该可以解决问题。

尝试这样的事情:

<span ng-class="show?'activate':'other-class'">
问题是

,我正在使用一个模块来实现scroll目的。 当我对此发表评论时,它有效。

var newHash = 'anchor3';
        if ($location.hash() !== newHash) {
          $location.hash('anchor3');
        } else {
          $anchorScroll();
        }

我评论了上面的所有内容。 谢谢大家!

最新更新