Question

我是AngularJS的新手。我正在尝试使用ng-include但它没有显示我提到的html文件。

app.js代码

    var app = angular.module('myApp', []);

    app.controller('mainCtrl', [$scope, function($scope)
    {
      $scope.templateID = 'testing1.html';

      $scope.changeTemplateID = function($scope){
          $scope.templateID = 'testing2.html';
        }

    }]);

index.html文件

<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <script data-require="angularjs@1.5.0" data-semver="1.5.0" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
    <link href="style.css" rel="stylesheet" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="mainCtrl">
    <ng-include src="templateID"></ng-include>
    <h1>Hello Plunker!</h1>

    <p ng-click="changeTemplateID()">next</p>
  </body>

</html>

根目录中有两个html文件。它们被称为 testing1.html 和 testing2.html 。我甚至尝试直接引用它们，如ng-include中的＆＃34;＆nbsp; test1.html＆＃39;＆＃34; 。

但没有成功。有什么帮助吗？

Answer 1

JS代码中的两个错误：

var app = angular.module('myApp', []);
    //                          vvvvvvvv  must be a string
    app.controller('mainCtrl', ['$scope', function($scope)
    {
      $scope.templateID = 'testing1.html';

      // you don't need to pass $scope here:
      $scope.changeTemplateID = function(){
          $scope.templateID = 'testing2.html';
        }

    }]);

Plunker供你细读。

Answer 2

app.controller('mainCtrl', [$scope, function($scope)... 您的[$scope必须是['$scope'，就像字符串一样，更改它就可以了。

我的ng-include不起作用

2 个答案: