角度单击执行2次单击功能

时间:2014-06-17 16:44:10

标签: angularjs twitter-bootstrap

我在django app的模板中有以下代码:

      <div class="list-group">
        <a ng-repeat="prog in programs | orderBy:'academic_program.program_title' | orderBy:'primary_program':true" href="/acadprog/{{prog.academic_program.acad_program_code}}/" ng-click="display.addprogram = false" class="list-group-item">
            {{prog.academic_program.program_title}}
                <span  
                    ng-if="prog.primary_program == true" 
                    class="glyphicon glyphicon-flag pull-right" 
                    ng-click="open2()">
                </span>
            <div style="padding-bottom:5px;">
                <span class="badge badge-success">{{prog.credits_completed}}</span>
                <span class="badge badge-info">{{prog.academic_program.required_credits}}</span>
            </div>
        </a>    
      </div>

此处open2()函数在单击标志时会打开一个模态对话框。模态工作正常,每当我删除<a>标签中 href 中的内容时,它就会打开。但是当我在 hrefs 中加入网址时,它们就不再打开了。可能会发生什么?我该如何解决这个问题?

我发现问题是因为点击标志也会在列表上执行点击功能,因为它正在重新加载整个视图!如何防止点击功能在href列表上发生?

1 个答案:

答案 0 :(得分:2)

您需要将事件传递给open2函数并在其上preventDefault()

<span  ng-if="prog.primary_program == true" 
       class="glyphicon glyphicon-flag pull-right" 
       ng-click="open2($event)">

 $scope.open2 = function(e) { 
   e.preventDefault(); 
   //do other stuff 
 }
相关问题