AngularJS绑定似乎不起作用

我对Angular相当陌生，并且一个简单的绑定对我不起作用。AngularJS绑定似乎不起作用

它只是显示我和{{trip.created}}正如他们写的。

我的控制器：

(function() { 
    "use strict"; 
    angular.module("app-trips") 
     .controller("tripsController", tripsController); 

    function tripsController() { 
     var vm = this; 
     vm.trips = [{ 
      name: "US Trip", 
      created: new Date() 
     }, { 
      name: "World Trip", 
      created = new Date() 
     }];

我的课的一部分：

@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 ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3"> 
     <table class="table table-responsive table-striped"> 
      <tr ng-repeat="trip in vm.trips"> 
       <td>{{ trip.name }}</td> 
       <td>{{ trip.created }}</td> 
      </tr> 
     </table> 
    </div>

控制器的看法：

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

BTW - 按说根据我的过程以下，我不需要['ngSanitize']，但没有它，它甚至不显示DIV s。

编辑：作为@jellyraptor注意到，我曾与=，而不是一个错字：

编辑2：

这是错字+的[ngSanitize]我真的没有需要。我修正了错字，并传递了一个空数组，一切正常。谢谢全部

来源

2017-08-28 sagi

这是一个猜测。基于它没有'['ngSanitize']'不起作用的事实，似乎你从未真正创建过角度模块。当您向'angular.module（moduleName，[数组相关性]）提供第二个（数组）参数时，会创建该模块。如果没有这个数组，角度将表达式视为一个getter而不是一个setter。 – ryanyuyu

因为您使用的是controllerAs语法，此处变量为vm。因此对于访问范围对象使用的vm代替tripsController

<tr ng-repeat="trip in vm.trips"> 
    <td>{{ trip.name }}</td> 
    <td>{{ trip.created }}</td> 
</tr>

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

 
    angular.module("app-trips") 
 
    .controller("tripsController", tripsController); 
 

 
    function tripsController() { 
 
    var vm = this; 
 
    vm.trips = [{ 
 
     name: "US Trip", 
 
     created: new Date() 
 
    }, { 
 
     name: "World Trip", 
 
     created: new Date() 
 
    }]; 
 
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.2/angular.min.js"></script> 
 
<div ng-app="app-trips" ng-controller="tripsController as vm" class="col-md-6 col-md-offset-3"> 
 
    <table class="table table-responsive table-striped"> 
 
    <tr ng-repeat="trip in vm.trips"> 
 
     <td>{{ trip.name }}</td> 
 
     <td>{{ trip.created }}</td> 
 
    </tr> 
 
    </table> 
 
</div>

来源

2017-08-28 15:39:20

对不起，这是一个错字，我在尝试解决这个问题时将其改为tripsController。这对我没有帮助。 – sagi

在控制台中显示什么错误？ –

没有..如果有一个我会在网上搜索答案.. – sagi

要么角没有加载或它遇到错误。用F12调出开发工具，看看控制台是否有错误。同样在控制台中，您可以键入'angular'并按回车，如果它报告角度未定义，那么角度加载不正确。

来源

2017-08-28 15:44:16

控制台是空的，我可以在哪里可以输入CONSOL？：S – sagi

我在'Debugger'部分打了'angular'，发现这行：'' – sagi

取决于浏览器。通常，控制台输出的底线是您可以输入的地方。在控制台窗口中查找'>'或'>>'。 –

您在您的旅程数组的第二个对象的“已创建”属性中加上了一个等号。

vm.trips = [{ 
    name: "US Trip", 
    created: new Date() 
}, { 
    name: "World Trip", 
    created = new Date() 
}];

应该

vm.trips = [{ 
    name: "US Trip", 
    created: new Date() 
}, { 
    name: "World Trip", 
    created: new Date() 
}];

来源

2017-08-28 15:53:34 JellyRaptor

谢谢你的看法！现在我在控制台中出现错误。请参阅编辑 – sagi

AngularJS绑定似乎不起作用

回答

相关问题