第二个控制器没有在Angular JS中执行?

时间:2016-05-21 06:45:28

标签: html angularjs

我是AngularJS的新手。我写了这样的代码,



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

myApp2.controller('studentController', function($scope) {
  $scope.student = {
    firstName: "first name",
    lastName: "last name",
    fullName: function() {
      var studentObject = $scope.student;
      return studentObject.firstName + " " + studentObject.lastName;
    }
  };
});

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

myApp1.controller('productController', function($scope) {
  $scope.quantity = 0;
  $scope.cost = 0;
  $scope.getTotalCost = function() {
    return $scope.quantity * $scope.cost;
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="col-lg-3" ng-app="myApp1" ng-controller="productController">
  <label class="label label-default">Quantity :</label>
  <input type="number" class="form-control" ng-model="quantity" />
  <br>
  <br>
  <label class="label label-default">Cost :</label>
  <input type="number" class="form-control" ng-model="cost" />
  <br>
  <br>
  <label class="label label-success">Product :</label><span class="form-control disabled" ng-bind="getTotalCost()"></span>
</div>
<div class="col-lg-3" ng-app="myApp2" ng-controller="studentController">
  <label class="label label-default">First name:</label>
  <input type="text" class="form-control" ng-model="student.firstName" />
  <br>
  <br>
  <label class="label label-default">Last name:</label>
  <input type="text" class="form-control" ng-model="student.lastName" />
  <br>
  <br>
  <label class="label label-success">You are entering:</label> <span class="form-control disabled" ng-bind="student.fullName()"></span>
</div>
&#13;
&#13;
&#13;

第二个div未初始化。我认为控制器没有执行。

如果我删除了第一个div,那么它就可以了。

它有什么问题?

1 个答案:

答案 0 :(得分:1)

您需要手动引导,查找以下链接:

https://stackoverflow.com/a/18583329/1939542