极客教程Ember.js EmberArray isEvery() 方法
Ember.js 是一款开源的JavaScript框架，用于开发基于MVC架构的大型前端Web应用程序。Ember.js是最广泛使用的前端应用程序框架之一。它旨在加快开发速度，提高生产力。目前，许多网站使用它，包括Square、Discourse、Groupon、Linked In、Live Nation、Twitch和Chipotle。
isEvery() 方法用于检查数组中的所有项是否都具有所需的值。
语法：
isEvery( key, value );
参数：
- key： 这是我们想要检查的属性名称。
- value： 这是要测试的值。默认值为true。
返回值： 如果数组中的所有项的传递的属性解析为所需的值，则返回true。
要运行以下示例，您需要有一个Ember项目。要创建一个项目，您需要首先安装Ember CLI。在终端中写入以下代码：
npm install ember-cli
现在，您可以通过键入以下代码来创建项目：
ember new <project-name> --lang en
为了启动服务器，请输入：
ember serve
示例1
输入以下代码以生成此示例的路由:
ember generate route isEvery1
app/routes/isEvery1.js
import Route from '@ember/routing/route';
class student {
name = null;
gender = null;
class = null;
grade = null;
constructor(name, gender, class, grade) {
this.name = name;
this.gender = gender;
this.class = class;
this.grade = grade
}
show_grade() {
return `I am {this.name} of
Class{this.class} Get ${this.grade}`;
}
}
export default class StudentsRoute
extends Route {
students =
[new student('Aakash', 'M', 10, 'A',),
new student('Soniya', 'F', 8, 'C'),
new student('Esnoor', 'M', 9, 'C'),
new student('Isha', 'F', 11, 'B',),
new student('Doman', 'M', 12, 'B'),
new student('Lolu', 'M', 10, 'A'),
new student('Satyam', 'M', 10, 'A'),
];
temp2;
temp;
model() {
return this.students;
}
setupController(controller, model) {
super.setupController(controller, model);
controller.set('students', this.students);
controller.set('temp', this.temp);
controller.set('temp1', this.temp1);
controller.set('temp2', this.temp2);
}
}
app/controllers/isEvery1.js
import Ember from 'ember';
import { mapBy } from '@ember/array';
export default Ember.Controller.extend({
actions: {
Every_Pass() {
let ans =
this.students.isEvery('grade', 'F');
ans ? alert(`All Student Doesn't pass in Exam`) :
alert('All Student pass in Exam');
},
Every_Female() {
let ans =
this.students.isEvery('gender', 'F');
ans ? alert(`All Student are Female`) :
alert('All Student are not Female');
},
Every_male() {
let ans =
this.students.isEvery('gender', 'M');
ans ? alert(`All Student are male`) :
alert('All Student are not Male');
},
},
});
app/templates/isEvery1.hbs
{ { page - title "Student" } }
<h3>List of Students: </h3>
<br /><br />
<table>
<tr>
<th>Name</th>
<th>Gender </th>
<th>Class </th>
<th>Grade </th>
</tr>
{{#each @model as |detail|}}
<tr>
<td>{{detail.name}}</td>
<td> {{detail.gender}}</td>
<td>{{detail.class}}</td>
<td>{{detail.grade}}</td>
</tr>
{{/each}}
</table>
<br/>
<br/>
<div>
<input type="button"
id="check-pass"
value="Is Every One Pass"
{{action 'Every_Pass' }} />
</div>
<br/>
<div>
<input type="button"
id="check-female"
value="Is All Student Female"
{{action 'Every_Female' }} />
</div>
<br/>
<div>
<input type="button"
id="check-male"
value="Is All Student male"
{{action 'Every_male' }} />
</div>
{ { outlet } }
输出： ：访问 localhost:4200/isEvery1 查看输出结果
示例2
输入以下代码以生成此示例的路由：
ember generate route isEvery2
app/routes/isEvery2.js
import Route from '@ember/routing/route';
import { } from '@ember/array';
export default class FruitsRoute
extends Route {
item1 = [
{
name: 'Apple',
isFruit: true,
color: 'red',
},
{
name: 'Grapes',
isFruit: true,
color: 'green',
},
{
name: 'Mango',
isFruit: true,
color: 'yellow',
},
{
name: 'Watermelon',
isFruit: true,
color: 'red',
},
{
name: 'Orange',
isFruit: true,
color: 'orange',
},
{
name: 'Lady Finger',
isFruit: false,
color: 'green',
},
{
name: 'Brinjal',
isFruit: false,
color: 'purple',
},
{
name: 'Potato',
isFruit: false,
color: 'brown',
},
{
name: 'Onion',
isFruit: false,
color: 'violet',
},
];
model() {
return this.item1;
}
setupController(controller, model) {
super.setupController(controller, model);
controller.set('item1', this.item1);
}
}
app/controllers/isEvery2.js
import Ember from 'ember';
import { removeAt, unshiftObjects, objectAt,
uniqBy, find } from '@ember/array';
export default Ember.Controller.extend({
actions: {
removeDetails(start, end) {
this.item1.removeAt(start, end);
},
All_fruit() {
let foo =
this.item1.isEvery('isFruit');
foo ? alert(`Yes all Item are Fruit`)
: alert(`There is some other items`)
},
Any_Vegy() {
let foo =
this.item1.isAny('isFruit', false);
foo ? alert(`Yes It contains Vegetable also`)
: alert(`There is No Vegetable in list`)
},
},
});
app/templates/isEvery2.hbs
{{page-title "Fruits"}}
<table style=" border-spacing : 30px">
<h3>Here is a list 1: </h3>
<ul>
{{#each @model as |eatable|}}
<li>{{eatable.name}}</li>
{{/each}}
</ul>
</table>
<div>
<label>Enter Start Index: </label>
{{input value=this.start}}
</div>
<div>
<label>Enter End Index: </label>
{{input value=this.end}}
</div>
<div>
<input type="button" id="remove-details"
value="Remove Details"
{{action 'removeDetails'
this.start this.end}} />
</div>
<br /><br />
<input type="button" id="all-Fruit"
value="All item are Fruits"
{{action 'All_fruit' }} />
<br /><br />
<input type="button" id="any-vegy"
value="Any item are Vegetables"
{{action 'Any_Vegy' }} />
{{outlet}}
输出 : 访问localhost:4200/isEvery2以查看输出
参考链接： https://api.emberjs.com/ember/4.6/classes/EmberArray/methods/isEvery?anchor=isEvery