1

我正在尝试使用测试应用程序（从 AngularJS 种子项目开始）学习 AngularJS，其中涉及用户会话。用户登录后，有多个视图。我为他们使用不同的部分。现在我的问题是，我想在应用程序内的所有视图中显示用户名和注销链接。

我能想到的唯一方法是在所有视图中为用户名和注销按钮添加所需的 html，并在每个控制器的范围内添加所需的数据。我认为这不是正确的做法。

我知道ui-router。但我无法使用它。

使用路由器或其他方法，我想实现这样的目标：

主要的html：

<div ng-view><!-- Main DIV -->
    <div><!-- Login partial comes here, if not logged in or else app partial will be displayed--></div>
</div>

应用部分：

<div>
  <div class='userInfo'><!-- userInfoPartialTemplate here --> </div>
  <div><!-- any other app partial template will be filled according to the url --></div>
</div>

任何建议或链接将不胜感激！

谢谢！

4

1 回答 1

0

ngInclude指令是你需要doc的。你可以尝试这样使用ngInclude：

<div>
  <div class='userInfo'><!-- userInfoPartialTemplate here --> </div>
  <div ng-include="'your-app-partial.html'"></div>
</div>

请注意，您的模板 URL 用单引号括起来！

此外，您可以使用 Angular 表达式在ngInclude. 例如，您有一个范围变量来保存模板 URL，您事先不知道该值是什么，您的控制器如下所示：

function Ctrl($scope) {
    $scope.subTemplate = 'your-app-partial.html'; // I use static string here for simplicity, but it could be anything that gives you the template URL...
}

该subTemplate变量保存模板的 URL 值，现在您的 HTML 应该如下所示：

<div ng-controller="Ctrl">
  <div class='userInfo'><!-- userInfoPartialTemplate here --> </div>
  <div ng-include="subTemplate"></div>
</div>

创建这个plunk是为了展示这个想法。

于 2013-06-16T21:49:17.373 回答