Question

我在html中有这段代码：

  <div ng-app="myApp" ng-controller="myCtrl">
        {{ firstName + " " + lastName}}
    </div>

    <div ng-app="MyApp">
        <div ng-controller="myCtrl">
             {{ firstName + " " + lastName}}
        </div>
    </div>

为什么第二个（分裂的div）的角度不起作用并且适用于第一个（仅一个div）？

btw我的.js就是这样：

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.firstName = "John";
$scope.lastName = "Doe";
});

编辑：这是我在页面上看到的内容：

 John Doe
 {{ firstName + " " + lastName}}

Answer 1

在第二个示例中，您将应用名称更改为MyApp。将其更改为myApp，它应该可以正常工作。

Answer 2

应用程序只能有一个ng-app指令。

每个HTML只能自动引导一个AngularJS应用程序文献。文档中找到的第一个ngApp将用于定义作为应用程序自动引导的根元素。要运行多个 HTML文档中的应用程序必须手动引导它们使用angular.bootstrap代替。 AngularJS应用程序不可能相互嵌套。

https://docs.angularjs.org/api/ng/directive/ngApp

当我拆分ng-app和ng-controller时，AngularJS无法正常工作

2 个答案: