Question

我想根据用户点击的内容查看不同的HTML页面。例如，我有三个标签设置如下：

<div class="span7" >
    <ul class="nav nav-tabs" style="margin-bottom: 5px;">
        <li class="active"><a href="#" ng-click="first()" data-toggle="tab">First</a></li>
        <li><a href="#" ng-click="second()" data-toggle="tab">Second</a></li>
        <li><a href="#" ng-click="third()" data-toggle="tab">Third</a></li>
    </ul>
    <div class="span12" style="margin-left:0;" ng-grid="gridOptions"></div>
</div>

我只想根据个人点击次数查看不同的页面。例如，如果他点击First，他会看到First的html页面，其中下面代码中的source.sourceObject表示要查看的html页面。它是这样写的：

<div class="span5">
    <div class="edus-activity-container">
        <div ng-show="sourceViewState.selected" class="edus-admin-activities-grid" />
    </div>
        <div ng-include="'/partials/' + source.sourceObject + '.html'"/>
</div>

在我的javascript文件中，如果我单击First，Second或Third标签，则定义source.sourceObject。但是，我的实施不起作用。我确保在source.sourceObject中我的文件拼写没有拼写错误。关于如何做的任何想法？

Answer 1

在您的控制器中：

var pages = { 'one': 'partials/one.html', 'two':'partials/two.html' }
$scope.currentPage = pages['one'] ; //This is required if you want a default page 

$scope.first = function(){ $scope.currentPage = pages['one']; }
$scope.two = function(){ $scope.currentPage = pages['two']; }

在您的模板/ HTML

中

<div ng-include="currentPage"/>

查看不同的HTML页面？

1 个答案: