Erişim angularjs eleman tıkladım
AngularJS oldukça yeniyim ben ve bir kavram kavrama değilim şüpheli. Ayrıca Twitter Bootstrap kullanıyorum ve jQuery yüklü var.
İş akışı: Kullanıcı listeden bir link tıklama, "bölümü güncelleştirildi ve kazançlar üzerine tıklandığında aktif sınıf bağlantısı kullanıcı." master
Temel HTML Biçimlendirme:
<ul class="list-holder" ng-controller="adminController">
<li><a ng-click="setMaster('client')">Clients</li>
<li><a ng-click="setMaster('employees')">Employees</li>
<li><a ng-click="setMaster('etc')>Etc...</li>
</ul>
JQuery bu işi yapmaya
jQuery(".list-holder").on('click', 'a', function(event){
event.preventDefault();
jQuery(".list-holder li").removeClass('active');
jQuery(this).parent('li').addClass('active');
});
Ama çözemedim nasıl entegre Açısal ve bir WordPress kullanmak için bu işi, çünkü ben kullanıyorum Açısal almaya master listesi (JSON form) sunucu ve güncelleme listesi sayfası.
Bunu nasıl entegre edebilirim? Açısal denetleyici işlev içinde olduğumu bir kez tıkladım ettim elemanı bulmak için görünmüyor olabilir
Denetleyici:
function adminController($scope)
{
$scope.setMaster = function(obj)
{
// How do I get clicked element's parent li?
console.log(obj);
}
}
CEVAP
Süre AngularJS verir sana ulaşmak bir yandan bir tıklama olay (ve böylece bir hedef değil) ile aşağıdaki sözdizimi (not $event
tartışma setMaster
fonksiyonu; belgeler burada: http://docs.angularjs.org/api/ng.directive:ngClick):
function AdminController($scope) {
$scope.setMaster = function(obj, $event){
console.log($event.target);
}
}
bu sorunu çözmenin yolu açısal değildir. AngularJS ile focus model manipülasyon. Bir model mutasyona ve AngularJS işleme çözelim.
AngularJS-bu sorunu çözme (jQuery kullanarak ve . olmadan ^strong>$event
değişken aktarmak için gerek kalmadanşöyle olmalı:
<div ng-controller="AdminController">
<ul class="list-holder">
<li ng-repeat="section in sections" ng-class="{active : isSelected(section)}">
<a ng-click="setMaster(section)">{{section.name}}</a>
</li>
</ul>
<hr>
{{selected | json}}
</div>
kontrol yöntemleri bu gibi görünecektir:
$scope.setMaster = function(section) {
$scope.selected = section;
}
$scope.isSelected = function(section) {
return $scope.selected === section;
}
Burada tam jsFiddle: http://jsfiddle.net/pkozlowski_opensource/WXJ3p/15/
AngularJS - çocuk kapsamında Erişim...
Nasıl angularjs sayfamda Dinlendirici ...
Erişim AngularJS bir Direktif özniteli...
Dışarıda js fonksiyonu erişim kapsamı ...
çocuk denetleyicisi Erişim üst kapsam ...