Javascript 以友好的方式传递对ng include的引用

基本上，我试图解决的是一个工作示例，在选项卡之间切换，我将使用相同的视图（但传递给

ng include

的参数不同）进行即将到来的访问和已完成的访问

Plunker中应用程序的说明（TL；DR） 在我的应用程序（AngularJS v1）中，我使用了一个模块来管理选项卡，其中内置了一些指令（）

使用这个插件，我试图在每个选项卡的主体中动态地包含相同的视图（使用

ng include

）

<ng-tabs ng-class="">
    <ng-tab-head ng-repeat="itemTab in itemTabs" ng-class="{ 'tabHead': true, 'active': itemTab.active }">
        {{ itemTab.tabHeader }}
    </ng-tab-head>

    <ng-tab-body ng-repeat="itemTab in itemTabs" ng-class="{ 'tabBody': true, 'active': itemTab.active }">
        <div ng-include="'app/visits/user-visits.html'" onload="userVisits(itemTab.visitState)"></div>

        <div ng-include="'app/visits/empty-visits.html'"></div>
    </ng-tab-body>
</ng-tabs>

选项卡正文中包含的第一个视图（

user visions.html

）是一个简单的视图，它也会重复多次，显示从API请求返回的访问的一些详细信息，而第二个视图则在特定正文没有访问（

empty visions.html

）时显示，但这是已经由控制器管理的东西。API的URL如下所示：

'apiHost/api/users/visits?include=client,address&visit_state=' + visitState

基本上，所有访问（即将进行和完成）都来自同一个API请求，URL中只传递了一个不同的参数

visitState

。这个参数是我想传递给included视图的参数，它告诉管理请求的控制器显示了哪个选项卡，以便它必须执行哪个请求

现在，我已经尝试了建议的

onload

属性，但这不起作用，建议的也不起作用

我认为这是因为在切换选项卡时，选项卡的内容应该刷新，因此内容不会在

onload

时仅加载一次这个想法我错了吗？

目前的情况是，tabs插件工作正常（因为我可以在单击选项卡和时看到索引的变化），但内容在选项卡之间没有变化，它只显示第一个选项（即将到来的访问）

我也尝试过使用这个特定的指令

angular.module('app').directive('includeTemplate', directive);

function directive() {
    return {
        templateUrl: function (elem, attrs) {
            return attrs.includeTemplate;
        },
        restrict: 'EA',
        scope: {
            'includeVariables': '&'
        },
        link: function (scope, elem, attrs) {
            var vars = scope.includeVariables();
            Object.keys(vars).forEach(function (key) {
                scope[key] = vars[key];
            });
        }
    };
}

这是建议的，但我认为它也不起作用，因为它期望传入一个明确的值，而不是作为

包含变量
的动态值。因此，在选项卡主体中，我使用了它

<div include-template="'app/visits/user-visits.html'" include-variables="{{ itemTab.visitState }}"></div>



我在什么地方错了吗？

您是否曾经遇到过这些动态级别的问题？

正如一开始所说的，我已经创造了这个，展示了整个问题。你可以玩它，帮我解决这个问题
 我推出了AngularJS UI路由器来解决这个问题

这个解决方案还意味着对config函数进行了彻底的重新设计，并放弃了我在上面的描述中尝试实现的几个指令

<div include-template="'app/visits/user-visits.html'" include-variables="{{ itemTab.visitState }}"></div>