哪个 ember.js 组件负责将模板插入到 DOM 中?

2024-02-04

我正在构建ember.js/rails应用程序。所有车把模板都存储在 .js 文件中。我想了解当路由器更改状态时它们如何插入到 DOM 中。Ember 的哪一部分执行此操作?我如何告诉 ember 放置模板?

现在我只能将我的模板附加到<body>我有一个jsFiddle 在这里 http://bit.ly/MItOcl.

我知道设置rootElement在 Ember.Application 上,但是我希望应用程序控制页面的其他元素。

车把 / HTML:

<script type="text/x-handlebars" data-template-name="application">
    <h2>I'm the content</h2>
    <p>This should be inbetween the header &amp; footer</p>
    <p><strong>time</strong> {{time}}</p>
</script>

<header>
    <h1>Application</h1>
</header>
<article>
    <div id="content"></div>
</article>
<footer>
    <a href="http://blog.deanbrundage.com" target="_blank">by Dean</a>
</footer>

​JavaScript:

window.App = Ember.Application.create();

App.Router = Em.Router.extend({
    initialState: 'root.home',
    root: Em.Route.extend({
        home: Em.Route.extend({
            view: App.ApplicationView
        })
    })
});

App.ApplicationController = Em.Controller.extend({
    time: Date()
});
App.ApplicationView = Em.View.extend({
    templateName: 'application'
});

App.initialize();

ember.js中的当前实现附加ApplicationView to the rootElement的应用程序,请参阅here https://github.com/emberjs/ember.js/blob/541d085ae039a190d24213d1476de53029355bf9/packages/ember-application/lib/system/application.js#L157-166.

一种可能的解决方案是覆盖appendTo你的ApplicationView, see http://jsfiddle.net/pangratz666/m8L6Z/ http://jsfiddle.net/pangratz666/m8L6Z/:

JavaScript:

App.ApplicationView = Em.View.extend({
    templateName: 'application',
    appendTo: function(){
        this._super('#content');
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

哪个 ember.js 组件负责将模板插入到 DOM 中? 的相关文章

  • 大型应用的回流/布局性能

    我正在使用 GWT 构建一个 HTML 应用程序 其性能总体上是正确的 有时 它会加载 DOM 中的许多对象 并且应用程序会变得很慢 我使用 Chrome 开发者工具分析器来查看时间花在哪里 在 Chrome 下 一旦应用程序被编译 即没有
  • Highcharts - 使用选定的饼图切片获得 3D 效果

    在 highcharts 中 我试图使当用户选择或将鼠标悬停在饼图的切片上时 该切片会产生沿 z 轴 朝向用户 上升的效果 我试图通过 css 设置阴影过滤器并使切片的边框更宽 填充颜色相同 来实现此目的 然而 我面临的问题是切片仍然可以位
  • 如何修复 IE6 上的不透明度

    如何修复 IE6 上的不透明度 此代码不适用于 IE6 filter alpha opacity 50 moz opacity 0 5 khtml opacity 0 5 opacity 0 5 还有这段代码 description ani
  • 如何在 Ember 中捕获数组是否插入到车把中?

    我希望这不是重复的问题 但我无法找到解决方案 我有工作和用户 一个用户有很多工作 JP User DS Model extend firstName DS attr string lastName DS attr string email
  • 在哪里放置固定装置?

    我应该在使用 ember cli 生成的 Ember JS 应用程序中的哪里定义固定装置 我尝试过很多地方 例如app js并在一个名为 fixtures 的文件夹中 经过一番挖掘后我发现改变Ember MODEL FACTORY INJE
  • 如何让 jquery Tooltipster 插件适用于新创建的 DOM 元素?

    我正在使用 Tooltipster 插件http calebjacob com tooltipster http calebjacob com tooltipster 这很棒 但我已经动态生成了插入到 DOM 中的内容 工具提示程序似乎没有
  • 是否有任何非轮询方式来检测 DOM 元素的大小或位置何时发生变化?

    很长一段时间以来 我一直在寻找一种方法来检测 DOM 元素的大小或位置何时发生变化 这可能是因为窗口调整了大小 或者因为向该元素添加了新的子元素 或者因为在该元素周围添加了新元素 或者因为 CSS 规则已更改 或者因为用户更改了浏览器的字体
  • 需要有关 React Js 的帮助

    我是 React Js 新手 我的代码无法正常工作 请看下面 这是我的脚本文件Main jsx 该文件由 React 编译 输出放置在 dist 文件夹下的 main js 文件中 var react require react react
  • 如何使用 Javascript 访问 iframe 元素?

    我有一个网页 其中 iframe 中有一个文本区域 我需要从其子页面 JavaScript 中读取此文本区域的值 目前通过使用window parent getelementbyID value在 JavaScript 中 我能够获取父页面
  • 在 jQuery 中,每次 DOM 更改时如何调用函数?

    我需要确保即使 DOM 更改后页面仍保持脚本描述的方式 我的脚本必须处理 DOM 的这些更改 以便我的脚本不仅仅处理初始状态 是否有一个事件可以用来处理这些 DOM 更改 从最严格的意义上来说 你的问题是这样的 Narrow the con
  • 从 Java 小程序访问 input type="file" 完整路径

    可以使用 netscape javascript JSObject API 从小程序访问 HTML DOM 但是 如果我查询输入类型 文件 的值 在某些浏览器 Opera 上我会得到所选文件的完整路径 但在其他浏览器 Firefox Chr
  • 同时使用 localStorage 和 REST 远程服务器的数据层架构

    任何人对于如何实现同时使用 localStorage 和 REST 远程存储的数据持久层都有任何想法或参考 某个客户端的数据存储在 localStorage 中 使用 ember data indexedDB 适配器 本地存储的数据与远程服
  • iOS Javascript DOM“冻结?”

    这里有几个问题 有没有办法阻止 iOS 在滚动时冻结页面上的 javascript 当您在另一个选项卡中或切换应用程序时 iOS 是否会冻结 JavaScript iOS 上还有其他主要的 javascript 限制吗 iOS 6 x 会暂
  • 如何使用 jquery live 停止事件冒泡?

    我试图停止一些事件 但 stopPropagation 不适用于 实时 所以我不知道该怎么做 我在他们的网站上找到了这个 现场活动不会在 传统方式 不能 使用 stopPropagation 停止或 停止立即传播 例如 以两次点击事件为例
  • document.referrer 跨浏览器兼容吗?

    我想使用 document referrer 进行非正式的推荐人检查 该元素跨浏览器兼容吗 当尝试引用文档对象时 浏览器会抛出错误吗 The document referrerDOM 规范中描述了属性 http www w3 org TR
  • 我可以向 DOM 对象添加任意属性吗?

    我可以向 JavaScript DOM 对象添加任意属性 例如
  • 如何获取 JavaScript 中已经找到的 div 中特定类的元素?

    我需要的是找到一个具有特定 id 的 div 然后找到其中具有特定类的任何元素 并使第一个元素不可见 我努力了 var hostDivName theHostDivName var hostDiv document getElementsB
  • 单击行内的按钮时防止触发表行 onclick 事件

    我有一个带有 ONCLICK 事件的表行 切换下面的附加数据 在其中一个行单元格内有一个按钮 单击时执行 AJAX 操作 当我单击按钮时 行的 onclick 事件也会触发 并且会发生附加数据在 AJAX 调用完成之前出现 这对我来说是一个
  • IE9 中的无效字符 DOM 异常

    以下这段 JS 曾经在 IE8 中工作 现在在 IE9 中失败 document createElement 我收到以下异常 SCRIPT5022 DOM 异常 INVALID CHARACTER ERR 5 上面这段代码是不是不符合标准呢
  • 允许指针(单击)事件穿过元素,同时保持滚动功能

    我的目标是拥有一个允许 下面要点击 交互的元素 滚动 众所周知 1 的解是pointer events none 这正如中所描述的单击 DIV 到底层元素 https stackoverflow com questions 3680429

随机推荐

  • Django - 改变迁移中的基础

    由于某些原因 我想对我的模型进行重大更改 我想以某种方式重新设计我的整个设计 但 Django 迁移实现通过不更新我的模型库来记住以前的设计 让我快速展示一下我以前拥有的和现在拥有的 app1 TopLevel app1 Intermedi
  • 将日期和整数合并到 ARRAY 中

    如何选择array agg ARRAY f1 date ARRAY f2 int f3 decimal 合并时出现错误date and integer在数组中 upd 添加了图片解释我计划在何处以及如何使用数组 问题是数据库大小 将 3 列
  • Python安装编译错误

    我希望有人可以帮助我 因为我已经被困在这个问题上有一段时间了 而且我对编译包不太熟悉 尝试安装以下软件包 https github com jhkorhonen MOODS wiki Installation https github co
  • 强制关闭 COM 端口

    我正在开发一个使用 COM 端口与外部控制器通信的应用程序 当我在连接通信电缆的情况下重新启动电脑时 Windows 7 打开该端口 但没有运行任何应用程序 因此我无法再访问它 我尝试以编程方式关闭它 但它仍然被占用 任何人都知道如何强制它
  • “VisualTree”被设置多次

    我在这个 xaml 文件中不断收到错误 属性 VisualTree 被设置多次
  • 两个视图 多个 UIPickerViews 单个出口

    我的应用程序有两个视图 具体取决于它决定加载哪个视图的方向 但是IB不允许我将两个PickerView连接到同一个OUTLET 有没有一种方法可以在代码中分配连接 以便在加载视图时将连接分配给outlet 或者我应该为每个视图做两次 或者我
  • 异常:ASP.NET MVC 控制器中的“值不在预期范围内”[重复]

    这个问题在这里已经有答案了 我有这个字符串要格式化 并且该部分抛出异常 字符串主体 private Task SendEmailConfirmation UserModel user var emailService new EmailUn
  • 执行特定的 Maven 阶段

    有没有办法执行 Maven 构建中的特定阶段 例如 如果我只想运行那些在预集成阶段执行的插件 Maven 是否提供了一种方法来做到这一点 e g mvn pre integration phase 您不能调用生命周期阶段本身 但可以调用绑定
  • 如何在后面的代码中添加两个CSS Class来控制?

    我在 ASP NET 后面的代码中设置 2 个 css 类 我可以这样做 txtBox Attributes Add class myClass1 txtBox Attributes Add class myClass2 它总是应用一个类
  • 无法更新 RVM - “致命:无法找到‘http’的远程帮助程序”

    我在 Ubuntu 8 04 上运行 RVM 1 1 6 突然无法再更新到最新版本 rvm get head Original installed RVM version rvm 1 1 6 by Wayne E Seguin email
  • 如何在 Matplotlib 中的绘图内绘制轴线?

    当我使用 Matplotlib 绘制数据时 默认情况下 轴始终绘制为框架图的框 假设我正在轴限制内绘制数据 2 lt x lt 2 and 2 lt y lt 2 但我想通过原点在该绘图区域内绘制轴线 最好沿着这些轴线绘制刻度线和刻度标签
  • AutoMapper null 源值和自定义类型转换器,无法映射?

    当将自定义类型转换器 ITypeConverter 与 AutoMapper 一起使用时 如果源值为null e g Mapper CreateMap
  • Python 类型在方法中暗示自己的类

    Edit 我注意到人们评论说类型提示不应该与 eq 当然 不应该 但这不是我问题的重点 我的问题是why该类不能用作方法中的类型提示参数 但可以在方法中使用itself 事实证明 Python 类型提示对我使用 PyCharm 时非常有用
  • java中这个说法正确吗?

    我想使用数据报套接字在两台计算机之间进行数据传输 我使用以下行 host InetAddress getByAddress mypc new byte 192 168 1 110 但是当我使用上述语句时 我收到此错误 可能会损失精度 所以我
  • 相当于: git log --exclude-author?

    在工作中 我们有一个 git 存储库 其中大部分提交都是机器人用户自动提交的 有时我更喜欢查看该存储库中的 git 日志 但看不到自动提交 我想它可以被描述为倒置的 git log author 或 git log exclude auth
  • 从 iPhone 上的视频输出获取静态图像?

    我正在编写一个应用程序来显示 iPhone 相机所看到的光照条件的统计数据 我每秒拍摄一张图像 并对其进行计算 为了捕获图像 我使用以下方法 void captureNow AVCaptureConnection videoConnecti
  • 使用 hiera 设置类参数?

    我试图弄清楚如何使用 hiera 设置类参数的值 我正在使用两个简单的类进行测试 testhiera 和 testhiera2 以下是这些课程 root puppet el7 001 modules cat testhiera manife
  • Xcode 上 Playground 的默认目录

    当我使用 Xcode 10 1 创建新的 Playground 时 它始终默认为 Library Autosave Information 我有什么办法可以改变这个吗 解决方法与symlink Close XCode gt 在终端中输入 m
  • Android Room类型转换多种枚举类型

    我正在为我的 Room 数据库编写一个类型转换器 我有几个自定义枚举类 我想在存储在数据库中时将它们全部转换为其序数 那么 有没有办法简化它 例如传递通用枚举类型 而不是为每个单独的类编写以下内容 class Converter TypeC
  • 哪个 ember.js 组件负责将模板插入到 DOM 中?

    我正在构建ember js rails应用程序 所有车把模板都存储在 js 文件中 我想了解当路由器更改状态时它们如何插入到 DOM 中 Ember 的哪一部分执行此操作 我如何告诉 ember 放置模板 现在我只能将我的模板附加到我有一个