ng-repeat属性不起作用。我正在使用angularJs,但ng-repeat不起作用。这是我的代码

时间:2016-08-27 16:18:00

标签: javascript angularjs angularjs-scope ng-repeat ng-controller

<div class="container">
    <div class="row" style="padding-top:50px" ng-controller="projects_control">
        <div class="col-md-12">
            <ul class="media-list">
                <li class="media" ng-repeat="project in projects">
                    <div class="media-left media-middle">
                        <a href="#"><img ng-src="{{project.image}}"></a>
                    </div>
                    <div class="media-body">
                        <h2 class="media-heading">{{project.name}} <span class="label label-danger label-xs">{{project.status}}</span>
                        </h2>
                        <p>{{project.short_description}}</p>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<script src="angular.min.js"></script>
<script>
var app = angular.module("mmproapp",[]);
app.controller=("projects_control", ["$scope", function($scope){
$scope.projects=[{
    image:"Aliens.jpg",
    name:"Quadcopter",
    status:"Currently under work",
    short_description:"This would be a short description about the project that would have atleast 5-6 lines explaining in short about the main goal of the project along with the major difficulty or something like that. Just to fill this description box.",
    long_description:"HCHCKGKJ>LGHCB>KLKYFIUKUJC"
},
{
    image:"daily_tasks.jpg",
    name:"Something",
    status:"Finished",
    short_description:"kmsegadkuyag;klusdglujwecliwe This would be a short description about the project that would have atleast 5-6 lines explaining in short about the main goal of the project along with the major difficulty or something like that. Just to fill this description box.",
    long_description:"HCHCKGKJ>LGHCB>KLKYFIUKUJC"
}];
}]);
</script>

我想使用ng-repeat和ng-controller以媒体格式在我的页面上显示很多项目。这是我写的代码。但是,每当我运行它时,根本不会出现任何问题。在空白之前,内容(理想情况下应该是什么)会闪烁大约半秒钟。我看到的只是一个空白页面。请告诉我我的代码在哪里错了!我不知道。

1 个答案:

答案 0 :(得分:0)

您的应用程序中存在一些错误。请参考这个plunker。它是您代码中的完整工作示例。此外,没有ng-app指令

https://plnkr.co/edit/0FZVMoPkMyLUJh4dsRdf?p=preview

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

app.controller("projects_control", ["$scope", function($scope) {

      $scope.projects = [{
        image: "Aliens.jpg",
        name: "Quadcopter",
        status: "Currently under work",
        short_description: "This would be a short description about the project that would have atleast 5-6 lines explaining in short about the main goal of the project along with the major difficulty or something like that. Just to fill this description box.",
        long_description: "HCHCKGKJ>LGHCB>KLKYFIUKUJC"
      }, {
        image: "daily_tasks.jpg",
        name: "Something",
        status: "Finished",
        short_description: "kmsegadkuyag;klusdglujwecliwe This would be a short description about the project that would have atleast 5-6 lines explaining in short about the main goal of the project along with the major difficulty or something like that. Just to fill this description box.",
        long_description: "HCHCKGKJ>LGHCB>KLKYFIUKUJC"
      }];

    }]);