1

次のディレクティブを使用して、クリック時にボタン テキストの値を切り替えようとしています。

   .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 を直接表示すると値が実際に変更されているように見えますが、ボタンの更新の値が表示されません。どうすればこれを実現できますか?

4

2 に答える 2

3

実施例

以下のコードを確認できますか:

テンプレート コード:

<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");
            }

          })
        }
      }
   });
于 2013-09-05T09:17:25.363 に答える
1

に変更restrict: 'E'するrestrict: 'A'と、コードがうまく機能します。これがテンプレートです

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

Working Demo

于 2013-09-05T04:35:19.347 に答える