Question

尝试使用以下指令切换按钮文本的值：

   .directive('startstop', function() {
      return {
        restrict: 'E',
        template: '<input value="" class="btn btn-success btn-lg">',
        link: function(scope, elem, attrs) {
          elem.bind("click", function(){
            console.log('startstop clicked', elem)
            if(elem.val() == "start") {
               elem.val("stop");   
            }
            else {
               elem.val("start");
            }
          })
        }
      }
   });

我能够检测到点击事件，当我直接在控制台中查看elem时，看起来实际上正在修改该值...但是我没有看到按钮更新的值。我怎么能让这件事发生？

Answer 1

Working Example

您可以查看以下代码：

模板代码：

<startstop></startstop>

指令代码：

directive('startstop', function() {
      return {
        restrict: 'E',
        replace:true,
        template: '<input type="button" value="" class="btn btn-success btn-lg">',
        link: function(scope, elem, attrs) {
          elem.bind("click", function(){
            console.log('startstop clicked', elem)
            if(elem.val() == "start") {
               elem.val("stop");   
            }
            else {
               elem.val("start");
            }

          })
        }
      }
   });

Answer 2

将restrict: 'E'更改为restrict: 'A'，您的代码效果很好。这是模板

<input type="button" startstop value="button"></input>

的 Working Demo

单击angularjs时切换按钮文本的值

2 个答案: