0
"M"のようにstudentの名前を入力し始めると、学生のリストには生徒のみが含まれていなければならず、その名前は残りの文字 "M"から始まります。しかし、入力値.lengthは常に定義されていません。これを行うにはAngularJS処理入力値
(function() {
var app = angular.module('app', []);
app.controller('DataController', function() {
this.students = arr;
this.compare = function() {
for (var i = 0; i < this.text.length; i++) {
if (this.text[i] == this.students.name[i]) {
alert(this.text);
return true;
}
}
}
});
var arr= [{
name: 'Azurite',
price: 2.95
}, {
name: 'Bloodstone',
price: 5.95
}, {
name: 'Zircon',
price: 3.95
}];
}());
HTML
<div class="container-fluid">
<div class="row-fluid">
<input class="col-md-12 col-xs-12" type="text" placeholder="Search people by name..." ng-model='text' ng-change='data.students.name'>
<div class="buttons">
<button class="btn btn-sort">Sort by name</button>
<button class="btn btn-sort">Sort by age</button>
<button ng-click='data.click()' class="btn btn-danger">Reset</button>
</div>
</div>
<!--Main content-->
<div class="main-table col-sm-8 col-md-7 col-md-offset-1 col-lg-7 col-lg-offset-1">
<table class="table table-hover">
<thead>
<tr>
<th class="text-center">Image</th>
<th>Name</th>
<th>Age</th>
<th>Phone</th>
</tr>
</thead>
<tbody ng-repeat='student in data.students' ng-show='data.compare()'>
<tr>
<td>
<img src="/img/cat.svg" alt="">
</td>
<td>{{student.name}}</td>
<td>41</td>
<td>[email protected]</td>
</tr>
</tbody>
</table>
</div>
</div>
「this.text」はどこにも定義されていません。 * 'DataController as data'のようにコントローラを宣言したように見えるので、' ng-model'は 'text'ではなく' data.text'でなければなりませんが、 'this'機能の中ではなく、コントローラの機能を指しています.... – Claies
filterFilterを使用してください。それがそれのためのものです。あなた自身で書く必要はありません。 –
@Claiesは、ng-model属性で定義されています。 –