爲什麼我的表單提交不起作用？

-2

我只想通過向它添加新元素來使用雙向綁定來更新我的列表。我不明白爲什麼我不能做到這一點？我錯過了一個重要的概念嗎？爲什麼我的表單提交不起作用？

的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>NgRailsTodoList</title> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
</head> 
<body ng-app="todoApp" ng-controller="MainCtrl"> 

    <div class="container"> 
    <div class="content-container clearfix"> 
     <div class="col-md-12"> 
     <h1 class="content-title text-center">Todo</h1> 
     <div ng-repeat="list in lists"> 
      <h3>{{list.name}}</h3> 
      <div ng-repeat="task in list.tasks"> 
      <h5><input type="checkbox" ng-checked="task.completed">{{ task.body }}</h5> 
      </div> 
     <div> 
     </div> 
     <form ng-submit="addList()"> 
     <input type="text" ng-model="name"></input> 
     <button type="submit"> New List </button> 
     </form> 
    </div> 
    </div> 

</body> 
</html>

app.js

angular.module('todoApp', ['ui.router', 'templates']) 
.factory('lists',[ function() { 
    var o = { lists: [{ name: "groceries", completed: false, 
        tasks: [{body: "buy fish",completed: true}, 
          {body: "buy sushi",completed: false}, 
          {body: "buy bread",completed: true}]}] 
      }; 
    return o; 
}]) 
.controller('MainCtrl', [ 
    '$scope','lists', 
    function($scope,lists){ 
    console.log(lists); 
    $scope.lists = lists.lists; 
    $scope.addList = function(){ 
     $scope.lists.push({name: $scope.name, completed: false}) 
     // console.log(this.name); 
     // $scope.name = ''; 
    }; 
    } 
]);

來源

2016-05-11 fenec

你在控制檯中得到了什麼錯誤？ –

什麼具體是不工作，什麼是期望的結果？ –

的問題是在標記。
<h5><input type="checkbox" ng-checked="task.completed">{{ task.body }}</h5> </div> <div> </div>

第二<div>應該是一場勢均力敵的標籤</div>

這裏是一個工作示例http://codepen.io/mkl/pen/KzEmwP

來源

2016-05-11 04:03:07 Michael

爲什麼我的表單提交不起作用？

回答

相關問題