禁用按钮时不执行操作 - Ember.js

时间:2014-08-12 08:34:48

标签: jquery ember.js handlebars.js

我的html中有以下操作:

<a href="#" class="list-group-item" disabled {{action addVisibilityService target="view"}}>
   element
</a>

我有处理此动作的功能:

addVisibilityService : function(element){
    console.log("I've been called");
},

但问题是禁用时会调用此操作。所以我想知道如何避免这种情况?

由于

1 个答案:

答案 0 :(得分:1)

似乎无法轻松禁用HTML链接(例如How to disable HTML links也有很多其他帖子)。您可以做的是使用{{if}}帮助程序,并根据特定状态将其显示为简单文本。

http://emberjs.jsbin.com/sefabibayile/1/edit

<强> HBS

<script type="text/x-handlebars" data-template-name="index">
    <i>if value less than 3 characters link disabled</i>
    {{input value=someProp}}
    <br/>
    {{#if somePropOk}}
    <a href="#" class="list-group-item" {{action addVisibilityService target="view"}}>
   element
</a>
{{else}}
<span style="font-style:italic;color:grey">element</span>
{{/if}}


  </script>

<强> JS

App.IndexController = Em.Controller.extend({
   someProp:"test",
  somePropOk:function(){return this.get("someProp").length>3;}.property("someProp")
});