我需要在Ember.js中组合linkTo和action helpers.我的代码是:
{{#link-to 'index'}}<span {{action 'clear'}}>Clear</span>{{/link-to}}
Run Code Online (Sandbox Code Playgroud)
但我想这样做:
{{#link-to 'index' {{action 'clear'}} }}Clear{{/link-to}}
Run Code Online (Sandbox Code Playgroud)
并且:
<li>
{{#link-to 'support'}}
<span {{action 'myAction' 'support'}}>Support</span>
{{/link-to}}
</li>
Run Code Online (Sandbox Code Playgroud)
至:
<li>
{{#link-to 'support' {{action 'myAction' 'support'}} }}Support{{/link-to}}
</li>
Run Code Online (Sandbox Code Playgroud)
我怎样才能做到这一点?
在常规车把我能够做到:
<div {{bind-attr class="model.isNew:new:old"}}>
Run Code Online (Sandbox Code Playgroud)
我怎么能在Htmlbars中这样做?我尝试了这个,但它没有用.
<div class="{{model.isNew:new:old}}">
Run Code Online (Sandbox Code Playgroud) 目标是定义HTML结构,该结构具有由调用者声明的多个内容块.例如,标题,正文和内容.生成的标记应该是:
<header>My header</header>
<div class="body">My body</div>
<footer>My footer</footer>
Run Code Online (Sandbox Code Playgroud)
实例化的组件的模板将定义这三个部分,My header,My body,和My footer.
使用Ruby on Rails,您将使用content_for :header从调用者捕获标头内容并yield :header进行插值.
这可能在ember.js中吗?
我正在尝试编写一个组件集成测试,这个博客文章,但我的组件有link-to一个动态路由,并且该href属性没有填写.这是我正在尝试做的简化版本.
我的组件的模板:
{{#link-to "myModel" model}}
Run Code Online (Sandbox Code Playgroud)
这是我测试的相关部分:
this.set('model', {
id: 'myId',
name: 'My Name'
});
this.render(hbs`
{{my-component model=model}}
`);
assert.equal(this.$('a').attr('href'), '/myModel/myId'); // fails
Run Code Online (Sandbox Code Playgroud)
在link-to被渲染,只是没有href属性.如果我在测试中记录HTML,它看起来像:
<a id="ember283" class="ember-view">My Name</a>
Run Code Online (Sandbox Code Playgroud)
我需要对我的"模型"做些什么才能获得link-tohref?我试着link-to在ember中查看测试,并发现这部分测试,这基本上就是我正在做的事情 - 提供一个带有id键集的POJO .有任何想法吗?
编辑:
DEBUG: -------------------------------
DEBUG: Ember : 1.13.8
DEBUG: Ember Data : 1.13.10
DEBUG: jQuery : 1.11.3
DEBUG: -------------------------------
Run Code Online (Sandbox Code Playgroud) 我有一组按钮,其状态我希望与班级切换active.如果我只有一个按钮,那么我会将active类绑定到控制器属性并在单击处理程序中切换该属性:
<button {{action 'toggle'}} class="{{active}}">model.title</button>
actions: {
toggle: function() {
this.set('active', true);
}
}
Run Code Online (Sandbox Code Playgroud)
但我有多个按钮,所以我不确定我能绑定什么.如果我可以将对单击按钮的引用传递给动作处理程序,那将非常有用,但我不知道如何执行此操作.
{{#each item in model}}
<button {{action 'toggle' referenceToButton}}>model.title</button>
{{/each}}
actions: {
toggle: function(buttonReference) {
// add `active` class to buttonReference
}
}
Run Code Online (Sandbox Code Playgroud)
完成此任务的最佳方法是什么?
有没有办法让Ember.Component强制重新渲染?
有.rerender()方法,但没有帮助.我也尝试使用.notifyPropertyChange模板,layoute - 相同
现在对于这种情况我需要将一块模板if包装成包装并切换标志的值.但方式是丑陋和无聊.
有任何想法吗?
在最新发布的EmberJS之后,v1.9.0我试图从Handlebars转移到HTMLbars.我发现非常具有挑战性的是缺乏文档.
我正在尝试实现非常简单的帮助器.
例如,拿这个把手帮手:
<div id="main"></div>
<script type="text/x-handlebars" data-template-name="index">
{{logIt test}}
<h1>{{test}}</h1>
</script>
Run Code Online (Sandbox Code Playgroud)
App = Ember.Application.create({
rootElement: '#main'
});
App.IndexRoute = Ember.Route.extend({
setupController: function(controller){
controller.set('test', 'mytest');
}
});
Ember.Handlebars.registerHelper("logIt", function(something) {
console.log(something);
});
Run Code Online (Sandbox Code Playgroud)
Js Fiddle:http://jsfiddle.net/sisir/p463q2L8/
如何将其转换为htmlbars?
我创建了一个 CMS,可以使用 HTMLbars 创建模板。模板应该在客户端编译,并且有一个组件应该显示模板。我将组件的 template 属性设置为一个函数,该函数使用 HTMLBars 返回编译后的模板。
import Ember from 'ember';
export default Ember.Component.extend({
content: null,
template: function () {
return Ember.HTMLBars.compile(this.get('content.template'));
}
}
Run Code Online (Sandbox Code Playgroud)
我已将 ember-template-compiler 包含在我的 Brocfile 中。
app.import('bower_components/ember/ember-template-compiler.js');
Run Code Online (Sandbox Code Playgroud)
也测试过
app.import('bower_components/ember-template-compiler/index.js');
Run Code Online (Sandbox Code Playgroud)
但模板永远不会被渲染。
我有两个模型Admin,User
我的应用程序模板如下
//application.hbs
{{outlet}}
{{header-nav}}
Run Code Online (Sandbox Code Playgroud)
我想做的事情(如果可能的话)可以{{header-nav}}自定义,我解释一下:如果admin我想在身份验证中呈现组件{{admin-header}}
的user身份验证它应该呈现的身份验证{{user-header}}.如何application.hbs动态构建要呈现的内容?
我目前正在从Ember 1.8.1升级到Ember 1.13.9.我的应用程序是一种oldschool,不使用ember-cli(没有es6任何语法).
如何正确替换已弃用的Ember.Handlebars.registerBoundHelper:
Ember.Handlebars.registerBoundHelper('date-ago',function(date) {
return moment.utc(date).fromNow();
});
Run Code Online (Sandbox Code Playgroud)
会建议你
DEPRECATION: `Ember.Handlebars.registerBoundHelper` is deprecated.
Please refactor to use `Ember.Helpers.helper`.
[deprecation id: ember-htmlbars.register-bound-helper]
Run Code Online (Sandbox Code Playgroud)
所以我想用'Ember.Helper.helper'替换'Ember.Handlebars.registerBoundHelper'会这样做,但是这些帮助器不再可用了:"未捕获的错误:断言失败:一个名为'date-ago'的助手不能找到了!".
如何在没有ES6语法或ember-cli魔法的情况下在Ember 2.0中注册htmlbars助手?