在视图 div Angularjs 中包含路由提供程序 templateurl 路径答案

【问题标题】：Include route provider templateurl path in view div Angularjs在视图 div Angularjs 中包含路由提供程序 templateurl 路径
【发布时间】：2016-01-29 16:24:06
【问题描述】：

我有以下路由提供程序设置，例如：

$routeProvider
.when('/', {
    templateUrl: '/slapppoc/Style Library/TAC/Views/tarification/home.html',
    controller: 'homeController'
         /*
    resolve: {
        // This function will be called before any controller/views are instantiated.
        'initializeApplication': function (initializationService) {                
            return initializationService.initializeApplicationData;
        }
    }*/
})
.when('/createTarif', {
    templateUrl: '/slapppoc/Style Library/TAC/Views/tarification/createTarif.html',
    controller: 'tarificationController'
 })
 .when('/search', {
    templateUrl: '/slapppoc/Style Library/TAC/Views/tarification/Search.html',
    controller: 'searchController'
 })     
.otherwise({ redirectTo: '/' });

现在我的主视图中有这样的 div 设置 -

<div ng-init="tab=1" >
        <div class="cb" ng-click="tab = 1">tab 1</div>
        <div class="cb" ng-click="tab = 2">tab 2</div>

        <div ng-show="tab == 1">
               How to include html templateurl path here  (createtarif.html)
        </div>

        <div ng-show="tab == 2">
                   How to include html templateurl path here  (search.html)
        </div>
</div>

编辑

我也尝试过像这样的 ng-include 指令-

<div ng-include src="'/slapppoc/Style Library/TAC/Views/tarification/createTarif.html'"></div>

但它也不起作用。

所以我想在后续的 div 中包含来自 templateurl 的 html。我该怎么做？因此，在切换 div 时，html 内容会自动更改。

感谢您的帮助。

【问题讨论】：

标签： html angularjs angular-routing

【解决方案1】：

像这样使用 ng-include ：（没有src）

<div ng-include="'/slapppoc/Style Library/TAC/Views/tarification/createTarif.html'" />

而不是这个

<div ng-include src="'/slapppoc/Style Library/TAC/Views/tarification/createTarif.html'"></div>

官方文档中的示例

<div ng-controller="ExampleController">
    <select ng-model="template" ng-options="t.name for t in templates">
        <option value="">(blank)</option>
    </select>
    url of the template: <code>{{template.url}}</code>
    <hr/>
    <div class="slide-animate-container">
        <div class="slide-animate" ng-include="template.url"></div>
    </div>
</div>

【讨论】：

【解决方案2】：

你可以查看 ng-include 文档https://docs.angularjs.org/api/ng/directive/ngInclude 有例子。

还有另一种方式。您可以添加新的元素指令并包含它

【讨论】：

我不明白“不起作用”是什么意思。您的模板未出现或无法正常工作？