hinzufügen Klasse auf schweben auf Angular JS

Ich versuche, eine Klasse hinzuzufügen, wenn in dem folgenden Code mit kantigemhinzufügen Klasse auf schweben auf Angular JS

<li ng-mouseenter="cola-selected=true" class="pull-left" ng-class="{'selected' : cola-selected}"> 
    <a href="interna.html"> 
     <img src="assets/images/cola.png"> 
    </a> 
</li>

Dies ist die gesamte Funktionalität der Seite haben die li Element schwebt, so dachte ich, vielleicht Es ist nicht unbedingt notwendig, eine neue js-Datei für die js hinzuzufügen.

Wenn die Maus in die li eingeben, sollte es die neue Klasse selected haben. Der Code darüber funktioniert nicht, und ich kann nicht herausfinden warum. Hier

ist ein Beispiel für meinen Code auf einer Geige: https://jsfiddle.net/mjrmeffc/

Quelle

2015-12-26 Pablo

Dieses Tutorial soll Ihnen helfen, https://scotch.io/tutorials/the-many-ways-to-use-ngclass Wenn nicht, dann werde ich in Kürze eine Antwort schreiben. –

Warum brauchen Sie eine zusätzliche Datei, wenn Sie die Logik in Ihrem Winkel Anwendung schreiben können?

Ich nehme an, Sie verwenden ng-app und haben eine so genannte Javascript-Datei, wo Ihre Logik ist, und Sie sollten es hier einfügen.

Hier ist ein Beispiel für den richtigen Weg zum Hinzufügen/Entfernen einer Klasse.

<div ng-app> 
    <div 
    class="italic" 
    ng-class="{red: hover}" 
    ng-mouseenter="hover = true" 
    ng-mouseleave="hover = false"> 
     Test 1 2 3. 
    </div> 
</div>

NB ich dies in einer anderen Frage Stackoverflow gefunden, bitte zuerst die ordnungsgemäße Verwendung der Google-Suche machen, ich habe nicht genug Ruf Flagge Ihre Frage oder einen Kommentar zu machen.

* EDIT *

Es scheint, wie Sie mit AngularJS noch nicht vertraut sind. Sie müssen Ihre 'app.js' oder 'script.js' angeben, wie Sie es auch nennen möchten. Dort definieren Sie Ihre Anwendung

var app = angular.module('yourappname', [/* add your dependencies here*/]); 

//Other logic like controllers or services

Und Ihre HTML sollte

YOURSELF

<div ng-app="yourappname"> 
<div ng-controller="yourController">

BITTE Orientieren sein mit ERSTE VOR IHNEN

Quelle

2015-12-26 14:52:38

Ich kopiere einfach deinen Code, es scheint der gleiche zu sein wie meiner, jedoch habe ich das gleiche Problem, die rote Klasse wird nicht hinzugefügt. – Pablo

Können Sie bitte einen codepen/jsfiddle bereitstellen oder Ihre Javascript-Datei hier einbinden? –

Ich habe meine Frage mit dem Link zu jsfiddle – Pablo

, Fragen START Versuchen Sie es mit ng-mouseover attr

<li ng-mouseover="hoverIn()" class="pull-left" ng-class="{{applyClass}}">

wri te eine Funktion hoverIn() in Ihrem Skript und Wert zuweisen, wenn schweben über

$scope.hoverIn = function() { 
    this.applyClass = "red"; 
}

Working Demo

Quelle

2015-12-26 15:38:20

hinzufügen Klasse auf schweben auf Angular JS

Antwort

Verwandte Themen