Question

在我的下面的代码中，我用ng-repeat重复了外部div，并包含了一个外部html模板，在内部div中有唯一的内容。如果我有很多模板，它实际上按预期工作，但我想知道我是否只能有一个模板，并通过id或其他方式包含其唯一内容。

适用于多个模板的代码：

<body  ng-controller="myCtrl as ctrl">

<div id="outer" ng-repeat="tpl in ctrl.templates">
    <div id="inner" ng-include="tpl.template"></div>
</div>

<script>
    var app = angular.module('myApp', [])
       .controller('myCtrl', [function() {
        var self = this;
        self.templates = [
            {template: 'template1.htm'},
            {template: 'template2.htm'}
        ]
    }]);
</script>
</body>

所需代码：

<div id="outer" ng-repeat="tpl in ctrl.templates">
    <div id="inner" ng-include="tpl.template"></div>
</div>

<script>
    var app = angular.module('myApp', [])
       .controller('myCtrl', [function() {
        var self = this;
        self.templates = [
            {template: 'template1.htm'} //only one template which include different data enclosed to divs with unique id
        ]
    }]);
</script>
</body>

template1.html

<div class="template" id="template">
    <p>
        Content From Template
    </p>
</div>
<div class="template" id="template2">
    <p>
        Content From Template 2
    </p>
</div>

NG-Include Pass Element By ID

0 个答案: