在Angular中玩佔位符

有沒有像ng-placeholder或類似的東西？在Angular中玩佔位符

我想把一個默認的佔位符是Risk，這是一個輸入是一個計算輸入，有時計算最後2秒，所以我想刪除那個Risk佔位符，並把一個加載器/微調器在那裏。這是我有它

<div> 

     <div> 
     <span ng-show="betLoader"><div class="spinner"></div></span> 
     <div ng-show="!betLoader">Win</div> 
     </div> 

     <input placeholder="Risk" 
      ng-model="parlayData.win"> 
    </div>

我有沒有$scope變量betLoader，當它出現true裝載機/旋轉，當它是假的，div字贏出現。我想要做的一樣，但不是在那裏，我想在佔位符輸入與風險，當betLoader爲真，然後隱藏風險字。

您有什麼建議？

編輯

考慮到微調與類spinner一個div。所以，我需要把這個微調器放在輸入中。

來源

2015-06-19 NietzscheProgrammer

有沒有一個'NG-placeholder'，但有一個佔位符'= 「{{bindHere}}」'... –

OK，但我怎麼做？我想把'''Risk'''這個詞當作默認的佔位符，所以，當betLoader爲false時，風險如何？ @ mypal125 – NietzscheProgrammer

您可以直接使用插值{{}}指令直接佔位符屬性。

標記

<input placeholder="{{betLoader ? 'Risk': ''}}" ng-model="parlayData.win">

更新

要更新內容微調，您可以使用ng-bind-html那裏。

的Html

<div> 
    <div ng-bind-html="betLoader ? '<span class="spinner"></span>': 'Win'"><div class="spinner"></div></span> 
    <div ng-show="!betLoader">Win</div> 
    </div>

來源

2015-06-19 17:00:58

是的，但看看下面這行：''

'''我需要放入佔位符的地方就像是微調類。這個類是包含微調的那個類。 – NietzscheProgrammer

@NietzscheProgrammer你想有條件地檢查添加'spinner' div和'Win'文本，那麼你可以簡單地在這種情況下使用'ng-bind-html'。看看我的編輯.. –

沒有內置ng-placeholder指令，你可以使用普通的placeholder有{{scopeParam}}或只是實施ng-directive

優勢的實施ng-placeholder是，如果它需要你的頁面加載的時間，你不會看到普通的{{scopeParam}}作爲你輸入的佔位符

的實現是很簡單的：

angular.module('ph', []) 
 
//directive starts here 
 
    .directive('ngPlaceholder', function() { 
 
    return { 
 
     restrict: 'A', 
 
     link: function(scope, element, attrs) { 
 
     element.attr("placeholder",attrs.ngPlaceholder); 
 
     } 
 
    }; 
 
    }) 
 
//directive ends here 
 

 
    .controller("phCtrl", function($scope){ 
 
    $scope.ph="The placeholder" 
 
    });

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

 
<div ng-app="ph" ng-controller="phCtrl"> 
 
    <input type="text" ng-placeholder="{{ph}}" /> 
 
</div>

來源

2015-06-19 17:11:02

在Angular中玩佔位符

回答

相關問題