今天我开始摆弄AngularJS上学。我几乎立刻遇到了一个我无法解决的问题,互联网上的解决方案对我没有帮助。
我使用角度种子项目作为我项目的骨架。
这会产生两个特别的文件:app.js和view1.js,它们包含我在view1.html中使用的控制器。
我的想法是,我需要一个可以在多个视图上全局使用的项目数组,因此不一定只在视图1上。
我制作了一个带有以下内容的controllers.js:
var todoAppControllers = angular.module('CarControllers', []);
todoAppControllers.controller('CarListController', ['$scope', '$http',
function($scope, $http) {
$scope.cars = [
{merk:'volkswagen', model : 'Up'},
{merk:'volkswagen', model : 'Golf'}
];
}]);
我的html在主index.html上看起来像这样(我已经省略了一些不相关的代码):
<html lang="en" ng-app="carApp" class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My AngularJS App</title>
</head>
<body>
<ul class="menu">
<li><a href="#/view1">view1</a></li>
<li><a href="#/view2">view2</a></li>
</ul>
<div ng-view></div>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="app.js"></script>
<script src="controllers.js"></script>
<script src="view1/view1.js"></script>
<script src="view2/view2.js"></script>
</body>
</html>
我的app.js:
'use strict';
// Declare app level module which depends on views, and components
angular.module('carApp', [
'ngRoute',
'carApp.view1',
'CarControllers'
]).
config(['$routeProvider', function($routeProvider) {
$routeProvider.otherwise({redirectTo: '/view1'});
}]);
最后是我想要显示我的汽车列表的页面。这不是一个部分观点:
<p>Cars:</p>
<ul ng-controller="CarListController">
<li ng-repeat"car in cars">{{car.merk}} model: {{car.model}}</li>
</ul>
当我运行npm并转到应用程序时,我只看到一个带有模型的子弹点(列表项):(因此没有merk是荷兰的品牌,也不是car.model。)
我该如何解决这个问题?提前致谢
答案 0 :(得分:1)
你有这个:
<li ng-repeat"car in cars">
你错过了一个相同的符号:
<li ng-repeat="car in cars">