Question

当我点击相应的链接时，我试图将各种html模板包含在页面上的单个div中（我愿意接受更好的想法，让我将链接设置为图标）..

我不确定为什么ng-include没有做任何事情

Html文件

    <div ng-controller="loadCtrl">

        <div>
            <ul>
                <li ng-repeat="block in blocks">

                    <a href="#" ng-model="block">
                        {{block.name}} - {{block.ctrl}}
                    </a>

                </li>
            </ul>
        </div>

        <div ng-include="block.ctrl"></div> 

    </div>

js控制器

    app.controller('loadCtrl', function ($scope, $http) {

        $scope.pyctrl = base_data + 'blocks.json';
        $scope.blocks = [];

        $scope.LoadBlocks = function(data, status){
            $scope.blocks = data;
        }

        $scope.fetch = function(){
            $http.get($scope.pyctrl).success($scope.LoadBlocks,console.log("Ok"));
        }

        $scope.fetch();

    });

json文件

    [
        {
            "name": "block 1",
            "ctrl": "dir1/dir2/template1.html"
        },
        {
            "name": "block 2",
            "ctrl": "dir1/dir2/template2.html"
        },
        {
            "name": "block 3",
            "ctrl": "dir1/dir2/template3.html"
        }
    ]

Answer 1

我认为您希望将ng-include保留在ng-repeat循环（li元素）中。

更新：如果您想在点击链接时在block中保存值，请使用ng-model="block"来ng-click="selectedBlock(block")而不是$scope.block = null; $scope.selectBlock = function(block){ $scope.block = block; }这个范围的函数。

{{1}}

Angularjs - ng-include不加载包含模板（没有可见错误）

1 个答案: