2017-04-17 71 views
2

我想在複製內顯示覆選框。複選框不顯示。複選框完全不顯示。我不明白什麼是misatke。下面是代碼 -複選框不會顯示在ng內重複angularjs

<div class = "col s4"> 
<form ng-submit="$ctrl.todoAdd()"> 
<input type="text" ng-model="$ctrl.todoInput" size="50" placeholder="Add New"> 
<input type="submit" value="Add New"> 
</form> 


<br> 
<div ng-repeat="x in $ctrl.todoList"> 
<input type="checkbox" ng-model="x.done"> <span ng-bind="x.todoText"></span> 
</div> 

<p><button ng-click="$ctrl.remove()">Remove marked</button></p> 
</div> 

和JavaScript代碼 -

angular. 
    module('dashboard'). 
    component('dashboard', { 
    templateUrl: 'dashboard/dashboard.html', 
    controller: ['$routeParams','$http', 
    function dashboardController($routeParams,$http) { 
    this.todoList = [{todoText:'Clean House', done:false}]; 

this.todoAdd = function() { 
    this.todoList.push({todoText:this.todoInput, done:false}); 
    this.todoInput = ""; 
}; 

this.remove = function() { 
    var oldList = this.todoList; 
    this.todoList = []; 
    angular.forEach(oldList, function(x) { 
     if (!x.done) this.todoList.push(x); 
    }); 
}; 
//Rest of the controller code 
} 
] 
}); 
+0

請問你的todolist的JSON樣子? – Sajeetharan

+0

它只是有屬性todoText和布爾屬性做 –

+0

它似乎工作,檢查演示 – Sajeetharan

回答

1

你必須傳遞給你的模塊,同時宣佈空的依賴,

改變它,

angular. 
    module('dashboard',[]). 

DEMO

var app = angular.module('myFirstApp', []); 
 
app.controller('myCtrl', function() { 
 
this.todoList = [{ 
 
    "todoText": "run today", 
 
    "done": false 
 
}, 
 
{ 
 
    "todoText": "read today", 
 
    "done": false 
 
}]; 
 
});
<html> 
 
    <head> 
 
\t <title>My First AngularJS App</title> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
\t <script src="app.js"></script> 
 
    </head> 
 
    <body> 
 
\t <h1>My First AngularJS App</h1> 
 
\t <div ng-app="myFirstApp" ng-controller="myCtrl as ctrl"> 
 
\t \t <div ng-repeat="x in ctrl.todoList"> 
 
<input type="checkbox" ng-model="x.done"> <span ng-bind="x.todoText"></span> 
 
</div> 
 
\t </div> 
 
    </body> 
 
</html>

+0

我試過了。現在我收到一個錯誤「名稱爲'dashboardController'的控制器未註冊。」 –

+0

@Sahanays檢查您是否註冊了控制器。您沒有提供足夠的代碼 – Sajeetharan

+1

區別在於模塊定義。原始海報不包括模塊定義所需的方括號。 –