AngularJS 应用程序无法启动

AngularJS Application not booting

本文关键字：启动 应用程序 AngularJS      更新时间：2023-09-26

我正在尝试启动一个angularjs项目，但是由于某种原因，我似乎无法正确启动它。这可能是某种错误，我被蒙蔽了。这是代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>WebUX</title>
    <link rel="stylesheet" href="css/index.css">
</head>
<body ng-app="webux">
    <section class="sidebar">
        <nav class="page-nav">
            <ul>
                <li><a href="#/home" class="home"></a></li>
                <li><a href="#/about" class="about"></a></li>
                <li><a href="#/contact" class="contact"></a></li>
            </ul>
        </nav>
    </section>
    <section class="content">
        <div class="slide" ng-view></div>
    </section>
    <script type="application/javascript" src="js/lib/angular.min.js"></script>
    <script type="application/javascript" src="js/lib/angular-route.js"></script>
    <script type="application/javascript" src="js/main.js"></script>
</body>
</html>

还有javascript：

var app = angular.module('webux', ['ngRoute']);
app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);
    $routeProvider.when('/', {
        templateUrl: 'partials/home.html',
        controller: 'HomeCtrl'
    });
}]);
app.controller('HomeCtrl', function($scope) {
    console.log($scope);
});

此外，HomeCtrl 中的控制台日志也不会触发。

更新

只是为了添加一些信息：

  • 控制台为空
  • 正确引用所有脚本文件

好的，非常感谢大家对我的帮助，但是我找到了解决方案。正如您在代码示例中所看到的，我使用 <div class="slide" ng-view></div> 来指定视图的呈现位置。在我检查了几次元素后，我发现铬剥离了该空属性。

<div class="slide" data-ng-view确实有效（注意"数据-"）。

相关文章：