如何将模型数据绑定到视图?

时间:2015-12-15 02:15:25

标签: angularjs

这是我的main.js文件: 我有我的模型任务列表数据,下面是我的控制器

var tasksList = [{description: 'Pick up mail at Post office today at noon'}, 
                                {description:'Pay the electric bills'}];

todoApp.controller('TasksCtrl',['$scope', function($scope){
    $scope.ngRepeat = function(){
        var i = 0
        alert('hi');
        $scope.tasksList.push(tasksList[i++]);
    };
}]);

我的观点如下:

<div ng-init ng-controller ='TasksCtrl' class='task-column'>
<div ng-repeat='(key,task) in tasksList' class='task-list'>
            <div class='easy'>
                <div class='div-list-style'></div>
                <div id='task-{{key}}' style='cursor:pointer;z-index:5' ng-click='toggleHide(key)' class='options pull-right glyphicon glyphicon-pencil'></div>
                <div class='task-desc' ng-bind='task.description'></div>
                <div ng-show='taskEdit[key]'>
                    <form class='edit-form'>
                      <textarea ng-model='task.description' class='tasks-textarea'></textarea>
                      <div md-content class='date'>
                        <div md-datepicker ng-model='dueDate' md-placeholder='due date'></div>  
                      </div>
                    </form>
                </div>
            </div>
        </div>
</div>

1 个答案:

答案 0 :(得分:3)

ng-repeat是一个内置的角度指令,您只需要一个列表来迭代。

todoApp.controller('TasksCtrl',['$scope', function($scope){
    $scope.tasksList = tasksList;
}]);

Angular Documentation for ng-repeat