AngularJS 标签不显示 HTML 个文件

Question

在我的 SPA 应用程序中，我有一个需要显示选项卡的视图。我的选项卡正确显示并且能够 select 每个选项卡，但由于某种原因，与选项卡关联的 html 未显示。它们与调用 html 代码位于同一文件夹中。我真的缺少什么，因为我真的需要让它工作。

查看-

<div class="view">
    <div class="container">
        <header>
            <h3><span class="glyphicon glyphicon-edit"></span> {{vm.title}} Practice
            </h3>
        </header>
        <div tabset>
            <div tab>
                <span tab-heading>Account Information</span>
                <span tab-content ng-controller="TabCtrl" ng-include="'#/practiceinfo.html'"></span>
            </div>
            <div tab>
                <span tab-heading>Billing Information</span>
                <span tab-content ng-controller="TabCtrl" ng-include="'#/practicebilling.html'"></span>
            </div>
        </div>
    </div>
</div>

路由器-

    $routeProvider
       .when('/patients', route.resolve('Patients', 'patients/', 'vm'))
        .when('/patientorders/:customerId', route.resolve('PatientOrders', 'patients/', 'vm'))
        .when('/patientedit/:customerId', route.resolve('PatientEdit', 'patients/', 'vm', true))
        .when('/physicians', route.resolve('Physicians', 'physicians/', 'vm'))
        .when('/physicianorders/:customerId', route.resolve('PhysicianOrders', 'physicians/', 'vm'))
        .when('/physicianedit/:customerId', route.resolve('PhysicianEdit', 'physicians/', 'vm', true))
        .when('/accounts', route.resolve('Accounts', 'accounts/', 'vm'))
        .when('/accountedit/:customerId', route.resolve('AccountEdit', 'accounts/', 'vm', true))
        .when('/practices', route.resolve('Practices', 'practices/', 'vm'))
        .when('/practiceedit/:customerId', route.resolve('PracticeEdit', 'practices/', 'vm', true))
        .when('/practiceinfo/:customerId', route.resolve('PracticeInfo', 'practices/', 'vm', true))
        .when('/practicebilling/:customerId', route.resolve('PracticeBilling', 'practices/', 'vm', true))
        .when('/institutions', route.resolve('Institutions', 'institutions/', 'vm'))
        .when('/institutionedit/:customerId', route.resolve('InstitutionEdit', 'institutions/', 'vm', true))
        .when('/orders', route.resolve('Orders', 'orders/', 'vm'))
        .when('/login', route.resolve('Login', 'accounts/', 'vm'))
        .otherwise({ redirectTo: '/login' });

Answer 1

将您的 ng-includes 更改为从您的 Web 应用程序的根目录开始的绝对路径。

ng-include="'#/practiceinfo.html'" 应该改成 ng-include="'/views/practiceinfo.html'"

Answer 2

类似于 here 我不认为你需要 ng-include 中的主题标签，因为你在 angular 的上下文中。 Angular 可能因为不正确 url 找不到文件，所以它什么也没显示。

<div class="view">
    <div class="container">
        <header>
            <h3><span class="glyphicon glyphicon-edit"></span> {{vm.title}} Practice
            </h3>
        </header>
        <div tabset>
            <div tab>
                <span tab-heading>Account Information</span>
                <span tab-content ng-controller="TabCtrl" ng-include="'practiceinfo.html'"></span>
            </div>
            <div tab>
                <span tab-heading>Billing Information</span>
                <span tab-content ng-controller="TabCtrl" ng-include="'practicebilling.html'"></span>
            </div>
        </div>
    </div>
</div>

AngularJS 标签不显示 HTML 个文件

AngularJS Tabs don't display HTML Files

angularjs

single-page-application