<!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. MySQL支持多种存储引擎

    MySQL的强大之处在于它的插件式存储引擎,我们可以基于表的特点使用不同的存储引擎,从而达到最好的性能. MySQL有多种存储引擎:MyISAM.InnoDB.MERGE.MEMORY(HEAP).B ...

  2. freemark页面中获取list循环中的counter

    如何在freemark页面中获取到当前list循环的counter 直接上代码 <#list lists as x> <#assign j=x?counter> ${j} // ...

  3. Php 的替代语法

    替代语法 为什么会有替代语法:     php是嵌入在html文档中的脚本语言,Php可以动态生成html标签,但是php主要功能并不是生成html标签,主要用于动态的生成数据(数据库中的数据).如果 ...

  4. java中的异常处理机制_finally的使用

    finally总结: finally代码块:定义一定执行的代码 通常用于关闭资源或者某些一定执行的代码 实例1:finally功能演示 class FuShuException extends Exc ...

  5. ifstream:incomplete type is not allowed

    IntelliSense: incomplete type is not allowed ifstream inputFile; Need to add this: #include <fstr ...

  6. HDOJ1005 数列

    Problem Description A number sequence is defined as follows:f(1) = 1, f(2) = 1, f(n) = (A * f(n - 1) ...

  7. mysql5.7的安装

    1.在官网下载解压缩版 2.解压后配置默认文件 新建个my.ini(可以复制一份my-default.ini,并改名为my.ini).my.ini会替换掉下面的my-default.ini文件. 按需 ...

  8. Sheepdog HTTP API

    1.sheepdog中http simple storage中nginx后台配置文件模板留存: events { worker_connections 1024;} http { server { l ...

  9. 在JQuery和Js中,如何让ajax执行完后再继续往下执行 async

    async (默认: true) 默认设置下,所有请求均为异步请求.如果需要发送同步请求,请将此选项设置为 false.注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行. var t ...

  10. Linux查找软件的安装路径

    软件安装的路径可能不止一个,可以使用whereis命令查看软件安装的所有路径,以mysql为例: whereis mysql 该命令会返回软件的所有安装路径: mysql: /usr/bin/mysq ...