<!DOCTYPE html>

<html>

<head>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>

<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0-rc.2/ember.js"></script>

<meta charset=utf-8 />

<title>JS Bin</title>

</head>

<body>

<script type="text/x-handlebars">

<h1>Application</h1>

<ul>

  <li>{{#linkTo "about"}}About{{/linkTo}}</li>

  <li>{{#linkTo "login"}}Login{{/linkTo}}</li>

</ul>

{{outlet}}

</script>

<script type="text/x-handlebars" id="about">

<h2>About</h2>

<ul>

  <li>

    {{#linkTo "about.location"}}Location{{/linkTo}}

  </li>

  <li>

    {{#linkTo "about.product"}}Product{{/linkTo}}

  </li>

</ul>

{{outlet}}

</script>

<script type="text/x-handlebars" id="index">

<h2>Index</h2>

</script>

<script type="text/x-handlebars" id="login">

<h2>Login</h2>

</script>

<script type="text/x-handlebars" id="about/index">

<h3>Index</h3>

</script>

<script type="text/x-handlebars" id="about/location">

<h3>Location</h3>

</script>

<script type="text/x-handlebars" id="about/product">

<h3>Product</h3>

</script>

</body>

</html>
body {

  font-family: sans-serif;

  color: #454545;

}

a {

  color: blue;

}

a.active {

  color: red;

}
var App = Ember.Application.create();

App.Router.map(function() {

  this.resource('about', function() {

    this.route('product');

    this.route('location');

  });

  this.resource('login');

});

Ember.js demo7的更多相关文章

  1. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

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

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

  3. Ember.js 的视图层

    本指导会详尽阐述 Ember.js 视图层的细节.为想成为熟练 Ember 开发者准备,且包 含了对于入门 Ember 不必要的细节. Ember.js 有一套复杂的用于创建.管理并渲染连接到浏览器 ...

  4. Ember.js入门教程、博文汇总

    第一章 对象模型 Ember.js 入门指南——类的定义.初始化.继承 Ember.js 入门指南——类的扩展(reopen) Ember.js 入门指南——计算属性(compute properti ...

  5. 点燃圣火！ Ember.js 的初学者指南

    现在,到处都可以看到复杂的 JavaScript 应用程序. 由于这些应用程序变得越来越复杂,一长串的 jQuery 回调语句,或者通过应用程序在各个点执行不同的函数调用,这些都变得无法再让人接受. ...

  6. Ember.js之动态创建模型

    本人原文地址发布在:点击这里 What problem did we meet? As ember document suggestion, we may define a model as a st ...

  7. Ember.js实现单页面应用程序

    1.1.1 摘要 单页应用程序 (SPA) 是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序. SPA使用AJAX和HTML5创建流畅且响应迅速的Web应用程序,不会经常 ...

  8. Ember.js系列文章

    JS前端框架之Ember.js系列文章 本文为文章索引,主要是罗列Ember.js的相关文章便于阅读. 相关演示代码:github for free. 基础篇 1. EmberJs之What|Why| ...

  9. 【JavaScript】前端开发框架三剑客—AngularJS VS. Backone.js VS.Ember.js

    摘要:透过对Github,StackOverflow,YouTube等社区进行数据收集后可知,AngularJS在各大主流社区中都是最受欢迎的,Backbone.js与Ember.js则不相伯仲.本文 ...

随机推荐

  1. Web开发知识点总结

    前言:这是一篇简单的web开发知识点的总结,适用于刚开始学习编程的人来学习的.我是为了能够在熟记熟记这些知识点而总结的一篇文章. 1       什么是浏览器? (1) 浏览器就是接收浏览者的操作(打 ...

  2. 设计模式------Adapter(适配器）

    地址:http://blog.csdn.net/wuzhekai1985/article/details/6665542,仅供学习用. 适配器:STL实现了一种数据结构,称为双端队列(deque),支 ...

  3. [jquery]基础篇--this与$this区别

    参考: http://www.cnblogs.com/hannover/p/4109779.html 1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(t ...

  4. 使用CHttpFile从服务器端正确的读取数据

    前段时间在给软件做升级提示模块的时候发现一个问题,就是使用CHttpFile对象无法从服务器端获取到正确的响应数据长度,无论是使用CHttpFile:: QueryInfo方法,还是使用CHttpFi ...

  5. 【nodemailer】 之邮件附件

    nodemailer 续 之前对nodemailer做了一个简单的了解,这篇文章主要研究一下如何添加附加文件 测试代码 //Created by yyrdl on 2015/10/2. var nod ...

  6. Mysql创建表时报错Table doesn't exist解决办法

    最近做项目时,本地数据库出了毛病,PHPMyadmin中有几张表不见了,我想应该是误删了吧,于是准备重新建一张表,可是问题出现了,sql报错,说表不存在... 什么鬼!就是因为表不存在我才要创建的好吗 ...

  7. 【HeadFirst设计模式】11.代理模式

    定义: 为另一个对象提供一个替身或占位符以访问这个对象. 远程代理 虚拟代理 保护代理.动态代理 其它: 远程代理的远程接口必须继承记号接口Remote 远程代理的使用过程中,要注意序列化的问题, 远 ...

  8. http数据包解析碰到gzip压缩格式的解压

    其中在做http数据包临控时碰到gzip压缩格式,在网友发布的一些技术文章基础上,经过一段时间的研究.调试,终于解析成功.现将核心代码公布于此,希望能够和大家一起共同学习交流.注:以下代码需要依赖zl ...

  9. easyui 初体验

    简介 jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面.开发者不需要编写复杂的javas ...

  10. Django同步创建models table失败

    django1.8通过manage.py syncdb 执行同步创建models中创建的表格失败 由于syncdb命令在1.9版本中会被remove, 需要改用makemigrations命令进行代替 ...