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

Question

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

$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.How 中包含来自 templateurl 的 html，我可以这样做吗？因此在切换 divs html 内容时会自动更改。

感谢您的帮助。

Answer 1

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

还有一个办法。您可以添加新的元素指令并包含它

Answer 2

像这样使用 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>

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

Include route provider templateurl path in view div Angularjs

html

angularjs

angular-routing