gyphicon-plusをユーザーがクリックしたときにテキストボックスを生成

Question

gyphicon-plusをクリックするたびにテキストボックスを生成する方法はありますか？私はそれがポップアップするときに、ユーザーがギフトプラスボタン&をクリックすることができますテキストボックスを生成するモットーを作成しようとしています。

ありがとうございます！

Answer 1

これを行うにはコントローラに関数を追加することができますが、DOMを操作するときはいつでもディレクティブを使用することをお勧めします。

ディレクティブの定義：

app.directive('addInput', function($compile){ 
    return { 
    restrict:'E', 
    template:'Click symbol to add <span ng-click="addTextBox()" class="glyphicon glyphicon-plus" aria-hidden="true"></span>', 
    link: function(scope, element){ 
     scope.addTextBox = function() { 
     var el = $compile('<input type="text">')(scope); 
     element.parent().append(el); 
     }; 
    } 
    } 
}) 

は、その後、あなたのHTMLにあなたがこれまでに達成したものをそのことについて

<add-input></add-input>