在已经设置route的情况下,以table为例,可以如下设置,范围为对应的模版;

App.TableView = Em.View.extend({
});
App.TableIndexView = Em.View.extend({
});

也可以通过如下新建,其获得的this为所在模版的this;

{{#view InnerView}}......{{/view}}

InnerView = Ember.View.extend({});

简单设置:

  • 设置整体的标签:

    • tagName
  • 设置class:
    • classNames:[](适合固定值);
    • classNameBinds[](这个要通过其他属性设置或方法返回,适合变值),同样使用在template设置classname的方法,如 ['isEnabled:enabled:disabled']
  • 设置其他attr属性

设置event方法:设置的方法配置在view内所有的element上;

使用模版:模版当中的书写格式与html模版相同;

   template: Ember.Handlebars.compile(""),

使用didInsertElement:在render和dom加载完之后执行,此外还有其他在不同时机执行的方法

  以tables和table为例在不同url跳转时候的执行:

  • x/x  ->  x/tables: 同时执行tablesIndexView和tablesView;
  • x/tables -> x/tables/id1: 只执行 tableview;
  • x/tables/id1 -> x/tables/id2 : 都不执行;
  • x/tables/id1  ->  x/tables: 只执行tablesIndexView;

在x/tables/id1 -> x/tables/id2 之间跳转的时候,可以在controller中定义一个方法

ember.js:使用笔记5 使用view的更多相关文章

  1. 【前端】Ember.js学习笔记

    Model 在默认情况下,model钩子返回的值,会设置为关联的控制器的model属性.例如,如果App.PostsRoute通过model钩子返回了一个对象,这个对象会设置为App.PostsCon ...

  2. ember.js:使用笔记9 开始单元测试

    单元测试被限定在一个范围内,并且不需要Ember应用运行. 使用前准备: 加入Ember-QUnit:获取一系列测试助手帮助单元测试:加入 mian.js; 加入根元素(与集成测试的时候一样):App ...

  3. ember.js学习笔记

    启动服务器 ember server 访问localhost:4200 创建新的路由:ember generate route 路由名称,运行此命令会同时创建一个/templates/.XXXhbs模 ...

  4. ember.js:使用笔记8 加载测试与集成测试

    emberjs使用的测试工具为qunit.js: 加载:将runner.js添加到Index.html:大致内容: if (window.location.search.indexOf("? ...

  5. ember.js:使用笔记2-数据删除与存储

    在模版中写好响应操作触发的action之后,可以在controller:actions中设置了,需要注意的是对数据的操作一般都是对单个object进行操作,所以先要使用笔记1中的方法使用ObjectC ...

  6. ember.js:使用笔记1-数组数据统一显示

    ember中数据一般都是以array的形式存储的,控制器使用,如: App.DataController = Em.ArrayController.extend({}); 想要在一个页面中输出所有的数 ...

  7. ember.js:使用笔记7 页面中插入效果

    在某些情况下,我们需要根据数据生成某些效果:由于每个模版的controller可能不同,在不同页面之间跳转可能会无法随即更新的问题. controller: 直接使用标签:{{}},适用于在子项目内切 ...

  8. ember.js:使用笔记10 常用方法

    init: controller中初始化方法,                               //注意该方法是在其他方法之前,所以取不出this,model等值: 跳转:this.tra ...

  9. ember.js:使用笔记6 子项目的前进与后退

    如下代码会根据model产生不同的table项,在进行其他设置后,一般是根据id来跳转到相应项目子项中: {{#each}} {{#link-to "tabls" this}}{{ ...

随机推荐

  1. Fifth scrum meeting - 2015/10/30

    概述 从昨天开始,我们的开发工作终于进入了正轨,由于之前没有mooc服务器API接口,一些工作无法进行. 因为我们团队开始开发较晚,因此我们将开发阶段的截至时间定为了下周五,测试阶段则压缩为下周周六和 ...

  2. Twelfth scrum meeting 2015/11/9

    第一阶段的开发即将结束,工程代码已经集合完毕,计划在2015年11月10日发布第一阶段的成果,本次会议主要商量下一阶段需要完成的工作以及页面修改,还有测试人员的bug整理. 会议记录: 第一项:界面修 ...

  3. [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  4. Boltzmann机

    博客园不能上传附件,所以这里贴两张流程图吧.一个是模拟退火算法的流程图(Boltzmann机本实上就是反复退火的过程), 个是Boltzmann调整权值的过程.

  5. Dynamo和Bigtable对比

    数据结构化问题        首先要提到的是两者存储数据属性上的区别,虽然两者都是以key/value形式进行存储,但Dynamo偏向存储原数据,因为其所存储的数据是非结构化数据,对value的解析完 ...

  6. Linux 面试题总结

    一. 填空题1. 在Linux系统中,以 (文件) 方式访问设备 .2. Linux内核引导时,从文件 (/etc/fstab) 中读取要加载的文件系统.3. Linux文件系统中每个文件用 (索引节 ...

  7. spring boot实战(第十二篇)整合RabbitMQ

    前言 最近几篇文章将围绕消息中间件RabbitMQ展开,对于RabbitMQ基本概念这里不阐述,主要讲解RabbitMQ的基本用法.Java客户端API介绍.spring Boot与RabbitMQ整 ...

  8. MySQL数据库索引的4大类型以及相关的索引创建

    以下的文章主要介绍的是MySQL数据库索引类型,其中包括普通索引,唯一索引,主键索引与主键索引,以及对这些索引的实际应用或是创建有一个详细介绍,以下就是文章的主要内容描述. (1)普通索引 这是最基本 ...

  9. Search a 2D Matrix | & II

    Search a 2D Matrix II Write an efficient algorithm that searches for a value in an m x n matrix, ret ...

  10. 【转】基于注解的SpirngMVC简单介绍

    转载地址:http://haohaoxuexi.iteye.com/blog/1343761 SpringMVC是一个基于DispatcherServlet的MVC框架,每一个请求最先访问的都是 Di ...