suchen

Heim  >  Fragen und Antworten  >  Hauptteil

javascript – Nach der Verwendung von UI-Router in Angular wird der Inhalt im Controller nicht ausgeführt

Nachdem Angular den UI-Router verwendet, wird der Inhalt im Controller nicht ausgeführt

Dies ist die Indexseite↓

<!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>
    <p ui-view="commonHeader"></p>
    <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>

Dies ist die öffentliche Headerseite↓

<nav id="header" ng-controller="HeaderPage">
    <p class="navbar navbar-fixed-top">
        <p class="container">
            <p class="navbar-header">
                <a href="/demo/index.html" class="navbar-brand">
                    <img src="/demo/images/logo.png" height="40">
                </a>
            </p>
            <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>
        </p>
    </p>
</nav>

Dies ist das js des öffentlichen Headers↓

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;
        
    });
    
}]);

Dies ist das js des Index↓

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: ''
        }
    ])

}]);

Der Code wird in app.controller('Header', ['$scope', '$http', '$stateParams', 'HeaderFac', '$location', function ($scope, $http, $stateParams) ausgeführt , HeaderFac , $location) {} Diese Zeile, aber der Inhalt in der Funktion wird nicht ausgeführt
Darf ich fragen, was das Problem ist

phpcn_u1582phpcn_u15822749 Tage vor514

Antworte allen(1)Ich werde antworten

  • 给我你的怀抱

    给我你的怀抱2017-05-19 10:35:31

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

    Antwort
    0
  • StornierenAntwort