【问题标题】:Restyling a website into Ember将网站重新设计为 Ember
【发布时间】:2014-09-04 17:30:33
【问题描述】:

我的任务是将网站重写为 Ember 应用程序。 到目前为止一切顺利,我了解了 Ember 路由、模型、控制器等的基础知识。不过,我现在对细节很感兴趣。 现在我在如何实现 Ember 视图和属性绑定方面遇到了麻烦。 我有一个这样的元素:

<a class="someClass" href="http://example.com" data-imgone="public/images/firstimg.jpg" data-imgtwo="public/images/secondimg.jpg" data-title="someTitle" data-description="someDescription">
    <div>
        <!-- some stuff -->
    </div>
</a>

据我了解(很可能是错误的,虽然哈哈)我应该在我的脚本中创建这个元素作为视图:

App.MyView = Ember.View.extend({
    tagName: 'a',
    attributeBindings: ['href', 'data-imgone', 'data-imgtwo', 'data-title', 'data-description'],
    href: 'http://example.com',
    'data-imgone': "public/images/firstimg.jpg",
    'data-imgtwo': "public/images/secondimg.jpg",
    data-title="someTitle",
    data-description="someDescription"
});

然后我应该使用视图助手调用 myView:

{{#view 'App.MyView}}
    <div>
        <!-- some stuff -->
    </div>
{{/view}}

这不起作用,元素没有被渲染。请告诉我我做错了什么。我完全误解了观点和属性绑定的观点吗? 另外,如果有人对我的任务有任何提示/策略,请分享!

【问题讨论】:

    标签: javascript html ember.js attributes views


    【解决方案1】:

    您不需要单引号来指定要呈现的视图。这应该足够了:

    {{#view App.SomeView}}Link Text{{/view}}
    

    在类中声明数据属性也不需要引号。数据属性可以这样映射:

    App.SomeView = Em.View.extend({
    
      tagName: 'a', 
      attributeBindings: ['href', 'dataImgone:data-imgone'],
    
      href: 'http://emberjs.com',
      dataImgone: "public/images/firstimg.jpg",
    });
    

    (见jsbin

    请注意,在attributeBindings 中,我传递了提供属性的函数/属性,后跟:attributename,在本例中为data-imgone,如['dataImgone:data-imgone']

    【讨论】:

    • 感谢您的快速回复!
    • 最后一条评论,尽可能使用组件而不是视图
    • 所以如果我理解discuss.emberjs.com/t/… 对:视图不再需要?
    • 并非如此。我仍然看到一些使用视图更好的用例。罕见的情况。对于你似乎在做什么,我会使用一个组件。
    猜你喜欢
    • 2011-07-28
    • 2014-08-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-10-18
    • 1970-01-01
    • 2014-02-26
    • 2015-12-21
    相关资源
    最近更新 更多