アンギュラマテリアルの多くの入力から1つのディレクティブを使用する方法を教えてください。

Question

私は次のテンプレートを持っている：

<md-input-container class="new-paragraph addon-menu"> 
    <label>Post text</label> 
    <textarea ng-model="user.post" rows="3"></textarea> 
</md-input-container> 
<md-menu> 
    <md-button aria-label="" class="md-icon-button" ng-click="$mdOpenMenu($event)"> 
     <i class="fa fa-plus-square-o mobile-menu-ic light-gray-text font-size-extra-large"></i> 
    </md-button> 
    <md-menu-content> 
     <md-menu-item ng-repeat="templateVariable in templateVariables"> 
      <md-button ng-click="injectVariableAtCursor(templateVariable);">{{templateVariable}}</md-button> 
     </md-menu-item>                
    </md-menu-content> 
</md-menu> 

は今、私は<md-menu-content>

内の特定の項目の際にユーザーがクリックuser.postモデルにいくつかの定義済みのテキスト（カーソル位置で）を挿入したい私は、ディレクティブことを知っています分離されたスコープでここで助けるかもしれないが、私はinputとしてこれを実装する方法がわかりませんし、ボタン自体は独立しています彼らは単一のngModelの下にラップされていません。

提案がありますか？

Answer 1

あなたはこれのための指示を必要としません。私はあなたの問題を理解していれば

これはおそらくenougth次のようになります。

コントローラ：

$scope.injectVariableAtCursor = function(templateVariable) { 
$scope.user.post = templateVariable; 
}; 

ここでは、あなたが何をしたいの例です：

var myController = function($scope) { 
 
    var target = null; 
 
    
 
    $scope.user = { post: "first" }; 
 
    
 
    $scope.handleFocus = function(event) { 
 
    target = event.target; 
 
    }; 
 
    
 
    $scope.handleClick = function(text) { 
 
    var start, end, actual = $scope.user.post; 
 
    
 
    if(target) { 
 
     start = target.selectionStart; 
 
     end = target.selectionEnd; 
 
    }else{ 
 
     start = end = $scope.user.post.length; 
 
    } 
 
    
 
    
 
    $scope.user.post = actual.substr(0,start) + text + actual.substr(end, actual.length); 
 
    }; 
 
    
 
}; 
 

 
angular.module('controller', []) 
 
    .controller('myController', myController);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="controller"> 
 
    <div ng-controller="myController"> 
 
    <textarea ng-model="user.post" ng-focus="handleFocus($event)"></textarea> 
 
    
 
    <button ng-click="handleClick('bla')">add bla</button> 
 
    </div> 
 
    
 
</div>