AngularJS - динамически изменять заполнитель ввода в контроллере

Question

У меня есть следующий HTML:

<input id="identification" name="identification" type="text" placeholder="{{trackingLoginCtrl.owcs.owcsDocumentPlaceHolder}}" ng-model="trackingLoginCtrl.owcsDocument" required="">
<p ng-click="trackingLoginCtrl.clickDotsIcon()">dots</p>

И в моем контроллере:

clickDotsIcon(){
        let vm = this;

        if(vm.owcs.owcsDocumentPlaceHolder === vm.$scope.trackingLoginCtrl.owcs.owcsDocumentPlaceHolder){
            vm.$scope.trackingLoginCtrl.owcs.owcsDocumentPlaceHolder = vm.owcs.owcsButtonTitle;
        }else{
            vm.$scope.trackingLoginCtrl.owcs.owcsDocumentPlaceHolder = vm.owcs.owcsDocumentPlaceHolder;
        }       
    }

Когда я нажимаю на точки, мне нужно поменять местозаполнитель на новый, и, если я нажму на него еще раз, он снова станет прежним. Мне удается изменить его на новый, но не обратно на старый.

Answer 1

Вы хотите динамически менять местозаполнитель. Вы можете решить свою проблему следующим образом!

function LoginController($scope) {
   $scope.owcsDocument = '';
   $scope.placeHolderIndex = false;
   
   $scope.clickDotsIcon = function(){
   
   $scope.placeHolderIndex = !$scope.placeHolderIndex;
   }
   
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.3/angular.min.js"></script>
<div ng-app ng-controller="LoginController">
    <input type="text" name="fname" placeholder="{{placeHolderIndex}}" ng-model="owcsDocument">
    <button type="button" ng-click="clickDotsIcon()">dots</button>
</div>

Answer 2

Предполагая, что оба значения заполнителей являются динамическими и могут быть изменены во время выполнения, вы можете обработать это следующим образом.

HTML

<input id="identification" name="identification" type="text" placeholder="{{trackingLoginCtrl.placeHolderValues[trackingLoginCtrl.currentPlaceholderIndex]}}" ng-model="trackingLoginCtrl.owcsDocument" required="">
<p ng-click="trackingLoginCtrl.clickDotsIcon()">dots</p>

JS

this.currentPlaceholderIndex = 0;
this.placeHolderValues = [this.owcs.owcsDocumentPlaceHolder, this.owcs.owcsButtonTitle];
clickDotsIcon(){
    let vm = this;
    vm.currentPlaceholderIndex = Number(!vm.currentPlaceholderIndex);
}