Question

我正在使用AngularJS路由创建一个目录，但我遇到了一个问题。目前我的目录中有几个部门，所有部门都有自己的HTML模板，并且都使用相同的控制器。然而，模板文件都是相同的，这里的这些行唯一不同。

 <div id="content" data-ng-init="contentCtrl('MG')">
        <div class="deptName">
            <h2>Management</h2>
        </div>
   
   //rest of content goes here
   
   </div>

所以我想到我可能只使用一个模板文件并为每个部门传递相关的JSON文件。

 <div id="content" data-ng-init="contentCtrl(activeDepartment)">
        <div class="deptName">
            <h2>activeDepartment</h2>
        </div>
   
   //rest of content goes here
   
   </div>

到目前为止，这个解决方案正在“正常工作”。但是，当我刷新页面时，它是空白的。我想我知道为什么会这样，但我不知道如何解决它。我认为它正在发生，因为当我刷新页面时，从未设置activeDepartment变量（当您单击主页上的部门时设置它）。我能想到解决这个问题的唯一方法是，如果有一些方法可以在我的路由提供程序中声明一个变量

$routeProvider
            .when('/MG', {
                controller: 'teammateController',
                templateUrl: './assets/departments/department.html',
                activeDepartment = management
            })

但是我似乎找不到办法做到这一点，我是否采取了错误的方式？任何帮助将不胜感激。

Answer 1

你的“我希望我能这样做”代码非常接近你实际做的事情！你想要：

$routeProvider
  .when('/MG', {
    controller: 'teammateController',
    templateUrl: './assets/departments/department.html',
    resolve: {
      activeDepartment: function() {
        return 'Management';
      }
    }
  })

然后，在resolve中定义的activeDepartment键可以作为依赖项注入控制器中，因此您可以在范围内获取它：

app.controller("teammateController", function(activeDepartment) {
  $scope.deptName = activeDepartment;
  (...etc...)
}

最后在你的模板中，

<div class="deptName"><h2>{{deptName}}</h2></div>

（通常resolve通常会返回比裸字符更有趣的东西;基本上你放入解析对象的每个键都可以作为依赖指向任何指令，控制器，服务等。需要它。）

AngularJS Routes：刷新时丢失内容

1 个答案: