Wie können wir jedes Eingabefeld in angularjs bearbeiten, indem wir die Schaltfläche "Bearbeiten" in Bootsrap verwenden?

Question

Ich arbeite mit angularjs E-Commerce-Projekt.Hier muss ich das Eingabefeld der Preis zeigen, wann immer ich in der Ansicht benötigt, mit der Bootstrap-Bearbeitungsschaltfläche.Wie kann ich den Code zum Bearbeiten eines Feldes in angularjs schreiben? Eigentlich muss ich den Preis eines Produkts in einer HTML-Seite zeigen. Dort ist der Bearbeitungsschaltfläche vorhanden und wenn ich auf diese Schaltfläche geklickt habe, muss ich zu einer anderen Seite gehen, um das Preisfeld zu bearbeiten HTML-Seite. Ich habe versucht, den Code für diesen ganzen Prozess zu schreiben.

Answer 1

Versuchen Sie, diese xeditable Plugin, es wird Ihre editierbaren Textbox, Gitter, Datetime usw.

Answer 2

Nach Ihrer Frage geben, Ihre schwierige Suche nach globalen Variablen zu handhaben. Es gibt zwei Möglichkeiten, wie Sie globale Variablen in angularjs definieren können, wie ich weiß.

• mit einem $rootScope -. http://docs.angularjs.org/api/ng $ rootScope

Obwohl u leicht $rootScope nur, indem sie in den controller und Änderungswerte Injektion verwenden können, aber sie haben Probleme. $rootScope ist das übergeordnete Element aller Bereiche. Daher sind die in rootscope definierten Werte grundsätzlich in allen Vorlagen sichtbar, die Sie definieren und verwenden, wobei Sie weniger Kontrolle über die Attribute $rootScope und ihre Werte haben. Weitere Informatio lesen this

• a Service http://docs.angularjs.org/guide/services

Verwendung würde dies in Ihrem Szenario ideal sein, weil Dienstleistungen Singletons sind. Dies bedeutet, dass Sie es in jeden Controller einspeisen und deren Werte nur innerhalb des Bereichs des Controllers verfügbar machen können. Demnach hast du mehr Kontrolle darüber. Unter "Geige" wird ein Beispiel für die Verwendung des Dienstes angegeben.

var myApp = angular.module('myApp', []); 
 
myApp.factory('UserService', function() { 
 
    return { 
 
    name: 'your name' 
 
    }; 
 
}); 
 

 
function MyCtrl($scope, UserService) { 
 
    $scope.name = UserService.name; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    Hello, {{name}}! 
 
</div>