Question

我正在尝试使用动态ng-include做一些AngularJs示例，但它不起作用。

这是我的例子。

＆＃13;

<!DOCTYPE html>
<html ng-app="exampleApp">
<head>
    <title>Directives</title>
    <script src="angular.js"></script>
    <link href="bootstrap.css" rel="stylesheet" />
    <link href="bootstrap-theme.css" rel="stylesheet" />
    <script>
        angular.module("exampleApp", [])
        .controller("defaultCtrl", function ($scope) {
            $scope.todos = [
            { action: "Get groceries", complete: false },
            { action: "Call plumber", complete: false },
            { action: "Buy running shoes", complete: true },
            { action: "Buy flowers", complete: false },
            { action: "Call family", complete: false }];

            $scope.viewFile = function () {
                return $scope.showList ? "list.html" : "table.html";
            };
        });
    </script>
</head>
<body>
    <div id="todoPanel" class="panel" ng-controller="defaultCtrl">
          <ng-include src="viewFile()"></ng-include>
    </div>
</body>
</html>

＆＃13;

我遇到的问题是，list.html和table.html这两个网页都没有被加载

如果我设置静态<ng-include src="'list.html'"></ng-include>，它可以正常工作。

它是从Visual Studio和Internet Explorer执行的标准HTML页面。

我在Chrome中对其进行了测试，并且它可以正常工作......它确实在Internet Explorer下工作。有任何想法吗？感谢

Answer 1

首先，我不会尝试将函数绑定到ng-include。

相反，我可能会使用ng-if

<ng-include ng-if="showList" src="'list.html'"></ng-include>
<ng-include ng-if="!showList" src="'table.html'"></ng-include>

AngularJS动态ng-include src不起作用

1 个答案: