Cómo obtener el valor de entrada de la página html usando angularJs en otra página html en angularJs

Gracias por A2A,

Asumiendo que:

  • estás trabajando con Angular 1.xx
  • Tener un conocimiento básico de controladores y directivas.

Puede obtener el valor de su cuadro de entrada en su controlador o directiva definiendo un atributo ng-model en su cuadro de texto y tener la misma variable declarada en su controlador / directiva (enlace fn).

/ * Código de controlador básico * /
angular.module (‘app’). controller (‘TestController’, [‘$ scope’, function ($ scope) {
$ scope.firstName = ”;

$ scope.getFirstName = function () {
console.log ($ scope.firstName);
devuelve $ scope.firstName;
};
}]);

/ * Marcado HTML básico para implementar lo mismo y
muestra el nombre ingresado en el desenfoque del texto * /

<entrada
tipo = “texto”
data-ng-model = “firstName”
marcador de posición = “Nombre”
data-ng-blur = “getFirstName ()” />

De esta manera, podrá obtener el valor ingresado en su controlador y podrá hacer el resto.

En la segunda parte, para obtener el valor en alguna otra página, hay dos escenarios en los que puedo pensar en esta:

  1. Página separada en la misma aplicación de página única: si está utilizando un enrutador angular o un enrutador ui, podrá acceder a los valores proporcionados utilizando servicios compartidos o utilizando $ rootScope (es posible que deba poner el valor en $ rootScope – no recomendado hasta que sea necesario o se esté utilizando en toda su aplicación ).
  2. Página separada por completo: no hay forma de que pueda obtener el valor una vez que la página se actualiza utilizando solo AngularJS. Si solo está probando cosas para comprender, le sugiero que use localStorage temporalmente [ no recomendado hasta que sea necesario ] hasta que obtenga una configuración de back-end y los servicios configurados.

Espero que ayude, y por favor avíseme si se requieren entradas adicionales.

Hola,

En primer lugar, su pregunta no cubre su caso de uso, supongo que desea preguntar sobre “cómo enviar datos de un controlador a otro”.

comencemos con eso, básicamente angularJs es SPA (Aplicación de página única), y cada controlador maneja una tarea específica y una vista de soporte.

Entonces, si siente que necesita pasar datos de un controlador a otro, lo está haciendo mal y debe repensar la funcionalidad de su aplicación.

así que eso es un poco sobre SPA.

ahora, si hay una condición en la que necesita pasar datos a través del controlador, básicamente hay algunas técnicas enumeradas a continuación.

  1. $ rootScope
  2. emit-broadcast-on
  3. guardar en el almacenamiento local y obtener otro controlador
  4. compartir a través de la fábrica
  5. usando cadena de consulta en url

Una buena manera es compartir a través de la fábrica

inicializar aplicación

// main.js
var aplicación = angular.module (‘AppName’, []);

crear un servicio de manejo de sesión

// sessionService.js
función sessionService () {
modelo var = {};
var sesión = {};
model.query = function (dataWhichNeeded) {
sesión de retorno [dataWhichNeeded] || nulo;
}
model.put = function (identificador, datos) {
sesión [identificador] = datos;
}
}
}
sessionService. $ inject = [];
app.service (“sessionService”, sessionService);

usarlo en controladores

poner valor en el primer controlador

// firstController.js
function firstController ($ scope, sessionService) {
$ scope.firstName = ‘Mr foo’;
sessionService.put (‘firstName’, $ scope.firstName);
}
firstController. $ inject = [‘$ scope’, ‘sessionService’]
app.controller (‘TestController’, firstController);

consulta el valor requerido en el segundo controlador

// secondController.js
function secondController ($ scope, sessionService) {
$ scope.firstName = sessionService.query (‘firstName’);
}
secondController. $ inject = [‘$ scope’, ‘sessionService’]
app.controller (‘TestController’, secondController);

y bum !!! has hecho tu trabajo, jaja

Gracias por leer.

No dude en preguntar cualquier problema por correo.

Necesita escribir un servicio para él usando el método getter y setter como

angular.service (“commonService”, [‘$ rootScope’, function ($ rootScope) {

var inputValue;
regreso {

getValue: function () {

return inputValue;

},
setValue: function (inputvalue) {
valor = inputValue;
}
}]);

e inyecte este servicio en pageOneController desde donde necesita guardar el valor de entrada y llamar al método de servicio
commonService.setValue (inputValue);

y en page2Controller obtener ese valor usando
commonService.getValue ();

todo el artículo está aquí Pase datos a otro controlador de página usando angularjs en asp.net mvc

el código rápido está aquí

otro código de página