javascript - AngularJS - 表达式未在 HTML 中显示

Question

我已经解决了其他问题，但找不到任何像我这样动态加载的 Controller / View 。我仍然担心这可能是一个重复的问题，但我已经尽职调查并一无所获。如果您更擅长搜索词，请为我指出正确的方向。

这就是我的应用程序的工作方式:我的索引页面加载指向 main.js 文件的 RequireJS，该文件概述了初始包含(app.js、routeResolver 和数据服务(当前未使用))。routeResolver 允许我动态地使用 app.js 中的如下代码加载我的 View 和各自的 Controller 。(使用一致的命名约定，在 home.html 中传递“home”加载，并将其与各自 Controller / View 位置的 homeController.js 关联起来。)不需要使用 ng-app='appname' 因为它是在运行时通过调用 app.js 文件中的 angular.bootstrap() 添加的。

//Define routes - controllers will be loaded dynamically
var route = routeResolverProvider.route;
$routeProvider
  .when('/', route.resolve('home'))
  .when('/createnew', route.resolve('createnew'))

在我的 Controller 中，我正在从 sessionStorage 加载一个变量。 (我已经确认它存在/可用。测试警报正确显示它。)我的问题是它没有显示在 html 页面上，并且控制台不会产生任何错误。我已经确认该页面准确地将其自身与 Controller 关联起来，因为如果我删除表达式，我会收到一个错误，表明它未定义...但尽管它包含一个值，但它仍然不显示。我得到的只是“欢迎”。

Controller :

'use strict';

define(['app'], function (app) {
    var injectParams = ['$location', '$filter', '$window', '$timeout'];

    var homeController = function ($location, $filter, $window, $timeout) {
          var userTitle = sessionStorage.getItem('userTitle');
          alert(userTitle);
    };

    homeController.$inject = injectParams;
    app.register.controller('homeController', homeController);
});

查看:

<div class="container-fluid text-center">
     <div class="row content">
          <div class="col-sm-2 sidenav">
               <p><a href="#">Placeholder</a></p>
          </div>
          <div class="col-sm-8 text-left">
               <p>Welcome {{ userTitle }}</p>
          </div>
          <div class="col-sm-2 sidenav">
               <div class="well">
                    <p>Placeholder</p>
               </div>
               <div class="well"></div>
          </div>
     </div>
</div>

我很乐意分享更多代码，但我不想让它太长，而且我觉得我只是错过了一些愚蠢的东西......

Answer 1

乍一看，我注意到当您想要将名为 userTitle 的局部变量添加到 $scope 时，您正在创建该变量。

将 $scope 注入(inject) homeController 和 $scope.userTitle = 'test';。这应该会得到你想要的。