Ember.js 是一个开源 JavaScript 框架,用于开发基于 Model-View-Controller (MVC) 架构的大型客户端 Web 应用程序。 Ember.js是使用最广泛的前端应用框架之一。它的目的是加速开发并提高生产力。目前,它被大量网站使用,包括 Square、Discourse、Groupon、Linked In、Live Nation、Twitch 和 Chipotle。
ArrayProxy的destroy()方法用于销毁该对象。此方法通过设置 isDestroyed 标志来销毁对象并删除其所有元数据。
句法:
this.Object.destroy() ;
Parameters: 它不需要任何参数。
返回类型:该方法返回一个对象。
安装和运行 Ember.js 的步骤:
第 1 步:要运行以下示例,您需要有一个 ember 项目。要创建一个,您需要先安装ember-cli。在终端中写入以下代码:
npm install ember-cli
第 2 步:现在您可以通过输入以下代码来创建项目:
ember new <project-name> --lang en
要启动服务器,请键入:
ember serve
示例 1:键入以下代码以生成本示例的路由:
ember generate route temp1
应用程序/路线/temp1.js
Javascript
import Route from '@ember/routing/route';
import ArrayProxy from '@ember/object';
import { computed } from '@ember/object';
const Person = ArrayProxy.extend({
fullName: computed('firstName', 'lastName', function () {
return this.get('firstName') + ' '
+ this.get('lastName');
}),
toStringExtension() {
return this.get('fullName');
}
});
export default class StudentsRoute extends Route {
person = Person.create({
firstName: 'Aman',
lastName: 'Verma',
gender: 'M',
class: 10,
marks: 83,
mobile: '8399384948',
grade: 'A',
})
model() {
return this.person;
}
setupController(controller, model) {
super.setupController(controller, model);
controller.set('person', this.person);
}
}
应用程序/控制器/temp1.js
Javascript
import Ember from 'ember';
import EmberObject from '@ember/object';
import { cacheFor, destroy } from '@ember/object';
export default Ember.Controller.extend({
actions: {
des() {
let t1 = this.person.destroy();
console.log(t1 + ' is Destroyed ')
},
print() {
console.log('Value of isDestroyed : '
+ this.person.isDestroyed)
},
}
});
应用程序/模板/temp1.hbs
HTML
{{page-title "ArrayProxy"}}
<table>
<h1>Student's Details:</h1>
<div><b>Name:</b> {{this.person.fullName}}</div>
<div><b>Gender:</b> {{this.person.gender}}</div>
<div><b>Class:</b> {{this.person.class}}</div>
<div><b>Mobile:</b> {{this.person.mobile}}</div>
<div><b>Grade:</b> {{this.person.grade}}</div>
<div><b>Marks:</b> {{this.person.marks}}</div>
</table>
<br /><br/>
<input
type="button"
id="CacheFor"
value="Destroy Details"
{{action 'des'}}
/><br /><br/>
<input
type="button"
id="CacheFor"
value="Print Ember Class"
{{action 'print'}}
/>
{{outlet}}
输出:
destroy()方法输出1
示例 2:键入以下代码以生成本示例的路由:
ember generate route temp2
应用程序/路线/temp2.js
Javascript
import Route from '@ember/routing/route';
import EmberObject from '@ember/object';
import ArrayProxy from '@ember/object/proxy';
const Employee = ArrayProxy.extend({
toStringExtension() {
return this.get('fullName');
}
});
export default class DetailsRoute extends Route {
person;
createPerson() {
let person = Employee.create({
name: 'Rahul Singh',
age: 24,
mobile: '1298119967',
country: 'India',
language: {
0: ['Bengali']
},
salary: 10000,
gender: 'M',
zipCode: '800020',
});
return person
}
model() {
this.person = this.createPerson();
return this.person
}
setupController(controller, model) {
super.setupController(controller, model);
controller.set('person', this.person);
}
}
应用程序/控制器/temp2.js
Javascript
import Ember from 'ember';
import EmberObject from '@ember/object';
const Employee = EmberObject.extend({
concatenatedProperties: ['work', 'contact'],
work: {
0: ['Developing Natural Language Processing']
},
contact: {
phone: ['9839281832']
}
});
export default Ember.Controller.extend({
actions: {
des() {
let t1 = this.person.destroy();
console.log(t1 + ' is Destroyed ')
},
print() {
console.log('Value of isDestroyed : '
+ this.person.isDestroyed)
},
IncreaseSalary() {
let temp = this.person.salary + 1000;
this.person.set('salary', temp);
}
}
});
应用程序/模板/temp2.hbs
HTML
{{page-title "ArrayProxy"}}
<table>
<h1>Employee's Details: </h1>
<div><b>Name:</b> {{this.person.name}}</div>
<div><b>Gender:</b> {{this.person.gender}}</div>
<div><b>Salary:</b> {{this.person.salary}}</div>
<div><b>Mobile No.:</b>{{this.person.mobile}}</div>
<div><b>Zip Code:</b> {{this.person.zipCode}}</div>
<div><b>Country:</b> {{this.person.country}}</div>
<div><b>Age:</b> {{this.person.age}}</div>
<div><b>Work Under:</b>
{{#each-in this.person.language as |key value|}}
<li>{{value}}</li>
{{/each-in}}
</div>
</table>
<br /><br/>
<input
type="button"
id="CacheFor"
value="Destroy Details"
{{action 'des'}}
/><br /><br/>
<input
type="button"
id="CacheFor"
value="Print isDestroyed Property"
{{action 'print'}}
/>
<br /><br/>
<input
type="button"
id="Change"
value="Increase Salary"
{{action 'IncreaseSalary'}}
>
{{outlet}}
输出:
destroyed()方法输出
参考:https://api.emberjs.com/ember/4.9/classes/ArrayProxy/methods/destroy?anchor=destroy
相关用法
- Embeer.js ArrayProxy decrementProperty()用法及代码示例
- Embeer.js ArrayProxy isDestroyed用法及代码示例
- Embeer.js ArrayProxy content用法及代码示例
- Embeer.js ArrayProxy cacheFor()用法及代码示例
- Embeer.js ArrayProxy objectAtContent()用法及代码示例
- Embeer.js ArrayProxy toString()用法及代码示例
- Embeer.js ArrayProxy replaceContent()用法及代码示例
- Embeer.js ArrayProxy removeObserver()用法及代码示例
- Embeer.js ArrayProxy insertAt()用法及代码示例
- Embeer.js ArrayProxy uniqBy()用法及代码示例
- Embeer.js ArrayProxy reduce()用法及代码示例
- Embeer.js ArrayProxy invoke()用法及代码示例
- Embeer.js ArrayProxy init()用法及代码示例
- Embeer.js ArrayProxy compact()用法及代码示例
- Embeer.js ArrayProxy set()用法及代码示例
- Embeer.js ArrayProxy filter()用法及代码示例
- Embeer.js ArrayProxy unshiftObject()用法及代码示例
- Embeer.js ArrayProxy objectAt()用法及代码示例
- Embeer.js ArrayProxy addObject()用法及代码示例
- Embeer.js ArrayProxy getProperties()用法及代码示例
- Embeer.js ArrayProxy rejectBy()用法及代码示例
- Embeer.js ArrayProxy slice()用法及代码示例
- Embeer.js ArrayProxy without()用法及代码示例
- Embeer.js ArrayProxy pushObject()用法及代码示例
- Embeer.js ArrayProxy incrementProperty()用法及代码示例
注:本文由纯净天空筛选整理自satyam00so大神的英文原创作品 Ember.js ArrayProxy destroy() Method。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。