AngularJS: $scope 在使用 ng-repeat 时未绑定到视图

Question

出于某种原因，当我使用 ng-repeat 时，$scope 变量没有将其数据绑定到视图。这让我发疯，因为我弄清楚在这种情况下我做错了什么。当我 console.log $scope 变量时，它在那里，但当我使用 ng-repeat 时它只是拒绝绑定到视图。在这种情况下，段落标记中的单词 "movie" 重复了 3 次，但没有数据与之对应。这是下面的代码：

<html ng-app="myApp" ng-controller="IndexCtrl">
<head>
<base href="/">
<title>Page Title</title>
</head>

<body>
<div>Hello World!
    <div ng-repeat="movie in movies">
       <p>movie: {{movie.moviename}}</p>
    </div>
</div>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script type="text/javascript">

var myApp = angular.module("myApp", []);

function IndexCtrl($scope) {
    $scope.movies = [
      {'moviename':'ironman'},
      {'moviename':'antman'},
      {'moviename':'man'} 
    ];
    console.log($scope.movies);
};
</script>
</body>
</html>

Answer 1

最好明确在模块内部定义控制器:

var myApp = angular.module("myApp", []);

myApp.controller('IndexCtrl', function($scope) {
    $scope.movies = [
      {'moviename':'ironman'},
      {'moviename':'antman'},
      {'moviename':'man'} 
    ];
    console.log($scope.movies);
});

但是....我完全复制了代码，替换了 angular 资源路径。一切正常。

<html ng-app="myApp" ng-controller="IndexCtrl">
<head>
<base href="/">
<title>Page Title</title>
</head>

<body>
<div>Hello World!
    <div ng-repeat="movie in movies">
       <p>movie: {{movie.moviename}}</p>
    </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script type="text/javascript">

var myApp = angular.module("myApp", []);

function IndexCtrl($scope) {
    $scope.movies = [
      {'moviename':'ironman'},
      {'moviename':'antman'},
      {'moviename':'man'} 
    ];
    console.log($scope.movies);
};
</script>
</body>
</html>

Answer 2

经过漫长的不眠之夜，哈哈，我找到了答案。显然问题出在我的 node js express 服务器使用 mustache 作为模板 html 的中间件。它也使用 {{ }} 符号，所以 angular 从来没有解释过发生了什么。所以我使用 $interpolateProvider 来更改 angular 符号，现在它工作得很好。

var myApp = angular.module('myApp', [], function($interpolateProvider) {
$interpolateProvider.startSymbol('[[');
$interpolateProvider.endSymbol(']]');
});

对于其他使用 node.js 后端而不使用 jade 作为模板语言的人，我希望这对您有所帮助！

AngularJS: $scope 在使用 ng-repeat 时未绑定到视图

AngularJS: $scope not binding to view when using ng-repeat

angularjs

angularjs-scope