Welcome to WuJiGu Developer Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
529 views
in Technique[技术] by (71.8m points)

angular 使用了ui-router 之后controller里面的内容不执行

angular 使用了ui-router 之后controller里面的内容不执行

这个是index页面↓

<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/app.css">
</head>
<body>
    <div ui-view="commonHeader"></div>
    <script src="js/jquery.js"></script>
    <script src="js/angular.js"></script>
    <script src="js/angular-ui-route.js"></script>
    <script src="js/header.js"></script>
    <script src="js/app.js"></script>
</body>
</html>

这个是公共头部页面↓

<nav id="header" ng-controller="HeaderPage">
    <div class="navbar navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <a href="/demo/index.html" class="navbar-brand">
                    <img src="/demo/images/logo.png" height="40">
                </a>
            </div>
            <ul class="nav navbar-nav navbar-right">
                <li ng-repeat="item in navLists">
                    <a href="javascript:;" class="ng-binding">
                        {{ item.name }}
                        <span>{{ item.en }}</span>
                    </a>
                </li>
            </ul>
        </div>
    </div>
</nav>

这个是公共头部的js↓

var header = angular.module('Header', []);

header.factory('HeaderFac', [function () {
    var HeaderFac = {};
    var lists;
    
    HeaderFac.setNavList = function (navList) {
        console.log(navList);
        lists = navList;
        console.log(lists);
    };
    
    HeaderFac.getNavList = function () {
    
        return lists;
    
    };
    
    return HeaderFac;
    
}]);

header.controller('HeaderPage', ['$scope', '$state', '$http', 'HeaderFac', function ($scope, $state, $http, HeaderFac) {
    
    $scope.$watch(HeaderFac.getNavList, function (newVal, oldVal, scope) {
        
        $scope.navLists = newVal;
        
    });
    
}]);

这个是index的js↓

var condition = "";

var getUserAdProgram = "";

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

app.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise(condition);
    $stateProvider.state('app', {
        url: condition,
        views: {
            'commonHeader': {
                templateUrl: '/demo/common/nav.html'
            }
        }
    });
}]);

app.controller('Header', ['$scope', '$http', '$stateParams', 'HeaderFac', '$location', function ($scope, $http, $stateParams, HeaderFac, $location) {

    HeaderFac.setNavList([
        {
            name: '首页',
            en: 'HOME',
            link: 'index.html'
        }, {
            name: '关于我们',
            en: 'ABOUT US',
            link: 'page/about.html'
        }, {
            name: '设计师风采',
            en: 'STYLE',
            link: ''
        }, {
            name: '作品展示',
            en: 'SHOW',
            link: ''
        }, {
            name: '教学与交流平台',
            en: 'TEACHING',
            link: ''
        }, {
            name: '更多选项',
            en: 'MORE',
            link: ''
        }, {
            name: '联系我们',
            en: 'CONNECT',
            link: ''
        }
    ])

}]);

代码会执行到app.controller('Header', ['$scope', '$http', '$stateParams', 'HeaderFac', '$location', function ($scope, $http, $stateParams, HeaderFac, $location) {} 这一行 但是function里面的内容不会执行
请问一下是什么问题


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

这个叫Header的controller并没有对应的页面啊


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to WuJiGu Developer Q&A Community for programmer and developer-Open, Learning and Share
...