angularjs scope variable change onclick для условного div

У меня есть два divs, которые я хочу показать им условно с событием onclick.angularjs scope variable change onclick для условного div

моего-угловой-app.js

$(document).on('click', '#showless', function(el) { 
var appElement = document.querySelector('[ng-app=myapp]'); 
var $scope = angular.element(appElement).scope(); 
    $scope.$apply(function() { 
     $scope.value = false; 
    }); 

}); 

$(document).on('click', '#showmore', function(el) { 
    var appElement = document.querySelector('[ng-app=myapp]'); 
    var $scope = angular.element(appElement).scope(); 
    $scope.$apply(function() { 
     $scope.value = true; 
}); 

});

и мой DIV из MyApp (myapp.html)

<div ng-show="desc" id="description" class="text-muted" style="padding-top:5px;padding-left:10px;padding-right:10px;color:#2E2E2E;font-size:11px;">{{myapp.value|truncate}}<span><a id="showmore" href="">more</a></span> 
    </div> 
    <div ng-show="!desc" id="description" class="text-muted" style="padding-top:5px;padding-left:10px;padding-right:10px;color:#2E2E2E;font-size:11px;">{{myapp.value}}<span><a id="showless" href="">less</a></span> 
    </div>

(усечение представляет собой фильтр, я написал, который работает отлично.)

источник

2013-11-22 Ratan Kumar

Похоже, что вы пришли из jquery. Угловой позволяет вам привязать «ng-click», поэтому вы можете сделать что-то вроде ng-click = toggle(), а в вашем JS-коде просто есть функция toggle(), которая изменяет состояние переменной desc. – asafge

Я использую его для расширения chrome, который не позволяет встроенные скрипты, что означает, что ng-click = toggle() не разрешено. –

'ng-click' не является встроенным скриптом. – Stewie

Я не совсем уверен, что вы пытаетесь сделать, но Angular обеспечивает ng-click, поэтому вам не нужно связываться с $(document).on('click').

Я хотел бы предложить более простой подход к условно-шоу:

<div ng-show="desc" id="description" class="text-muted" style="padding-top:5px;padding-left:10px;padding-right:10px;color:#2E2E2E;font-size:11px;">{{myapp.value|truncate}}<span><a id="showmore" ng-click="desc = true" href="#">more</a></span> 
    </div> 
    <div ng-show="!desc" id="description" class="text-muted" style="padding-top:5px;padding-left:10px;padding-right:10px;color:#2E2E2E;font-size:11px;">{{myapp.value}}<span><a id="showless" ng-click="desc = false" href="#">less</a></span> 
    </div>

Вышеприведенные использует ng-click, чтобы установить значение desc. Поэтому вам не нужна никакая другая логика в контроллере для переключения divs.

источник

2013-11-22 09:17:09

Цель состоит в том, чтобы переключать desc, по more и less как у, как правило, чтобы показать и скрыть большой текст. надеюсь, я понятен. спасибо .. –

Обновлено. Я переместил 'ng-click' в' a'. –

angularjs scope variable change onclick для условного div

ответ

Смежные вопросы