动态linkTo带有Ember.js中的普通锚点标记

export default Ember.Component.extend({ 
    tagName: '', 

    actions: { 
    checkUrl(post) { 
     if(!Ember.get(post, 'property')) { 
     event.preventDefault(); 
     // show modal dialog 
     } 
    } 
    } 
}); 

<a href="{{post.otherUrl}}" {{action 'checkUrl' post preventDefault=false}}>URL</a>

以上组件带有生成链接以打开'otherUrl'。如果POST对象不包含“otherUrl”我会表演一个模式对话框动态linkTo带有Ember.js中的普通锚点标记

对话框模板（不同成分）

<p>No Link Found. Go to <a class="post-link">post</a> and add otherUrl</p>

我想将“链接后”锚标记指向不同的'post'路线，每次像'post/1'，'post/2'等等，都是基于首先点击的帖子用户。我应该重新编译还是重新渲染模态对话框模板。一种方法可以操作DOM，并为该“后链接”添加href，从而实现后期用户点击。但生成的链接将触发整页加载而不是路由。可能有人指导我如何实现这一目标

来源

2017-06-13 Lokesh Cherukuri

而是链接到可能无效的URL，防止如果是过渡的，只是呈现一个不同的锚标记：

{{#unless post.property}} 
    <a href={{post.otherUrl}}>URL</a> 
{{else}} 
    <a href="#" {{action 'showModal' post}}>URL</a> 
{{/unless}}

让showModal动作泡沫直到（或者甚至更好的是，传递闭包动作）控制器渲染模态。将传递的帖子设置为该控制器上的属性，并将该属性传递给要呈现的模态组件。如果你不能直接链接到模态的帖子，你可以有另一个关闭模态和转换的动作。类似这样的：

// app/controllers/posts.js 
export default Ember.Controller.extend({ 
    selectedPost: null, 

    actions: { 
    showModal(post) { 
     this.set('selectedPost', post); 
     // TODO: show the modal 
    }, 

    editPost(post) { 
     // TODO: hide the modal 
     this.transitionToRoute('post', post); 
    } 
    } 
}); 

// app/templates/posts.hbs 
{{#modal-dialog}} 
    <p>No Link Found. Go to <a href="#" {{action 'editPost' selectedPost}} class="post-link">post</a> and add otherUrl</p> 
{{/modal-dialog}}

来源

2017-06-13 21:12:48 mwp

动态linkTo带有Ember.js中的普通锚点标记

回答

相关问题