AngularJS 变量不会持续查看答案

【问题标题】：AngularJS variable does not persist to viewAngularJS 变量不会持续查看
【发布时间】：2016-12-25 05:05:31
【问题描述】：

这里有一个奇怪的错误，我可以成功切换到其他视图，但我的问题是即使是简单的变量也无法“到达”视图。有人看到我的（可能是愚蠢的）错误吗？

Index.html

<html ng-app="myApp">
<head>
    <title>AngularJS oefening</title>
    <link href="css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
    <div class="container">
        <header>
            <a href="#/home">Home</a>
            <a href="#/about">Over ons</a>
            <a href="#/contact">Contact</a>
        </header>
        <div ng-view>

        </div>
        <footer>
            Copyright...
        </footer>
    </div>

    <script src="js/angular/angular.min.js"></script>
    <script src="js/angular/angular-route.min.js"></script>
    <script src="js/controller.js"></script>
</body>

Controller.js

angular.module('myApp', ['ngRoute'])
    .config(moduleConfig);

moduleConfig.$inject = ['$routeProvider'];

function moduleConfig($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: 'views/home.html',
        controller: 'homeController',
        contollerAs : 'homeCtrl'
    })
    .when('/home', {
        templateUrl: 'views/home.html',
        controller: 'homeController',
        contollerAs : 'homeCtrl'
    })
    .when('/about', {
        templateUrl: 'views/about.html',
        controller: 'aboutController',
        contollerAs : 'aboutCtrl'
    })
    .when('/contact', {
        templateUrl: 'views/contact.html',
        controller: 'contactController',
        contollerAs : 'contactCtrl'
    })
    .otherwise({
        redirectTo: '/'
    });
};

angular.module('myApp')
    .controller('homeController', homeController)
    .controller('aboutController', aboutController)
    .controller('contactController', contactController);

function homeController() {
    this.msg = "Hello home";
};

function aboutController() {
    this.msg = "Hello about";
};

function contactController() {
    this.msg = "Hello contact";
};

Home.html

<div>
    <h1>{{homeCtrl.msg}}</h1>
</div>

我使用硬编码文本进行了测试，每当我使用菜单导航时，它都会提供正确的视图。我也尝试过记录不同的对象（homeController、homeCtrl、...）。只有变量 this 不是未定义的，但这个变量只包含 $scope。

提前致谢。

【问题讨论】：

您在 head 部分缺少。尝试在每个控制器中制作 console.log。这应该让您了解它们是否正确插入。
我没有收到任何控制台错误，那么为什么要使用标记？我试过控制台登录控制器，它们出现了。 编辑： 当我打开视图时，它甚至会在 HTML 中显示
标签 (

)
您使用的是哪个版本的 Angular？

标签： javascript angularjs angularjs-routing angularjs-controlleras

【解决方案1】：

搜索了将近 2 个小时后.. 我发现了我的愚蠢.. 愚蠢的错误。

contollerAs -> controllerAs

【讨论】：

好点，这是 JS 的问题之一，您可以无限添加参数而不会出现任何错误。
确实如此。我觉得很奇怪，Angular 没有对这些参数进行任何检查。无法想象我是第一个遇到这个“问题”的人哈哈。