リソースとしてAngularからレンダリングされた見積もりのビューがあります。見積もりの一部を非表示にしましたが、クリックすると残りの見積もりが表示されます。私が抱えている問題は、引用の本文を正しく切り替えることです。
角度コントローラーで、クリックするとdom要素の表示が非表示と表示の間で切り替わるように設定しました。私の現在のコードにはいくつかのバグがあります（遅く、脳のおならがあります）
私の問題は私が自己学習していることです、そして私が尋ねなければ、これらのことを理解するのに何時間もかかります。私の現在のng値はShowMeを設定し、それが== trueの場合、他のすべての引用符本体が表示されます。どんな援助もいただければ幸いです。
Angular
app.controller("QuotesCtrl", ['$scope', '$http', 'Quotes', 'Quote', '$location', function($scope, $http, Quotes, Quote, $location ) {
$scope.quotes = Quotes.query();
$scope.quote = Quote.query();
$scope.switchQuote = function (id) {
if(document.getElementById('quotebody' + id).style.visibility == 'hidden') {
document.getElementById('quotebody' + id).style.visibility = 'visible'
$scope.showMe = true;
} else {
document.getElementById('quotebody' + id).style.visibility = 'hidden'
$scope.showMe = false;
}
}
}
]);
html
<div class="quotes col-xs-10 col-md-8" ng-controller="QuotesCtrl">
<div ng-repeat="quote in quotes">
<a ng-click="switchQuote(quote.id)" ng-value="showMe">
<span>Quote id: {{quote.id}}</span>
<span>Name: {{quote.name}}</span>
<span>Email: {{quote.email}}</span>
<span>City: {{quote.city}}</span>
</a>
<div id="quotebody{{quote.id}}" ng-show="showMe">
<span>City: {{quote}}</span>
<span>City: {{quote.city}}</span>
<span>City: {{quote.city}}</span>
</div>
</div>
</div>
これには、ng-showまたはng-ifを使用します。switchQuote関数を使用すると、値をtrueからfalseに、またはその逆に切り替えることができます。
おそらく多くの引用符があり、それらはng-repeatにあるため、クリックされた引用符を表示または非表示にするには、各引用符オブジェクトのプロパティ（私の例ではプロパティ "visible"）を使用する必要があります。
HTML：
<div class="quotes col-xs-10 col-md-8" ng-controller="QuotesCtrl">
<div ng-repeat="quote in quotes">
<a ng-click="switchQuote(quote)">
<span>Quote id: {{quote.id}}</span>
<span>Name: {{quote.name}}</span>
<span>Email: {{quote.email}}</span>
<span>City: {{quote.city}}</span>
</a>
<div ng-show="quote.visible">
<span>City: {{quote}}</span>
<span>City: {{quote.city}}</span>
<span>City: {{quote.city}}</span>
</div>
</div>
</div>
コントローラ：
app.controller("QuotesCtrl", ['$scope', '$http', 'Quotes', 'Quote', '$location', function($scope, $http, Quotes, Quote, $location ) {
$scope.quotes = Quotes.query();
$scope.quote = Quote.query();
$scope.switchQuote = function (quote) {
quote.visible = !quote.visible;
}
}]);
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加