AngularJS不显示控制器

时间:2017-07-31 18:32:35

标签: angularjs asp.net-mvc

我有以下代码:

Trips.cshtml:

@section Scripts{
    <script src="~/lib/angular/angular.min.js"></script>
    <script src="~/js/app-trips.js"></script>
    <script src="~/js/tripsController.js"></script>
}
<div class="row" ng-app="app-trips">
<div >{{"Two plus two : " + (2+2)}}</div>
  <div ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3">
      {{ vm.name }}
   </div>
  </div>

APP-trips.js:

   (function () {
   "use strict";
   angular.module("app-trips", []);
  })();

tripsController.js:

(function () {
    "use strict";
    angular.module("app-trips")
        .controller("tripsController", tripsController);
    function tripsController() {
        var vm = this;
        vm.name = "jaka";
    }
})();

在我的.cshtml中,我得到“2 + 2”= 4以角度显示,但我没有调用我的vm.name。有谁知道可能是什么问题?

2 个答案:

答案 0 :(得分:1)

你还没有关闭div,

<div class="row" ng-app="app-trips">
<div >{{"Two plus two : " + (2+2)}}</div>
  <div ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3">
      {{ vm.name }}
  </div>
</div>

<强>样本

 angular.module("app-trips", []).controller("tripsController", tripsController);
 function tripsController() {
        var vm = this;
        vm.name = "jaka";
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="row" ng-app="app-trips">
<div >{{"Two plus two : " + (2+2)}}</div>
<div ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3">
      {{ vm.name }}
</div>

答案 1 :(得分:1)

&#13;
&#13;
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-route.min.js"></script>
    <!-- <link href="Styles.css" rel="stylesheet" /> -->
   <script>
 (function () {
   "use strict";
   angular.module("app-trips", []);
  })();
  (function () {
    "use strict";
    angular.module("app-trips")
        .controller("tripsController", tripsController);
    function tripsController() {
        var vm = this;
        vm.name = "jaka";
    }
})();
   </script>
</head>
<body >
   <div class="row" ng-app="app-trips">
<div >{{"Two plus two : " + (2+2)}}</div>
  <div ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3">
      {{ vm.name }}
  </div>
</body>
</html>
&#13;
&#13;
&#13;