각도 재료의 많은 입력에서 하나의 지시문을 사용하는 방법은 무엇입니까?

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>