$scope angularJS

Publicado en 'Programación' por hioko, 27 Set 2019.





  1. hioko

    hioko Miembro maestro

    Registro:
    20 Oct 2014
    Mensajes:
    891
    Likes:
    49
    Temas:
    102




    Estoy intentando imprimir el resultado de una funcion a mi index, pero sale en blanco.Solo imprime en consola.

    [​IMG]

    [​IMG]
     


  2. gnox

    gnox Miembro de bronce

    Registro:
    3 Ene 2013
    Mensajes:
    2,247
    Likes:
    883
    Temas:
    75
    Me has hecho acordar de esa basuu.. de angular, el tema va porque estas usando promesas (javascript), me acuerdo que tambien me saco canas el porque se perdia el scope cuando se usaba funciones dentro de promesas y algo tenia que ver con tener que hacer bindings (uso de this).

    ejemplo de perdida de scope
    Código:
    <div ng-app='app'>
      <div ng-controller='xCtrl'>
        <span>{{email}}</span>
      </div>
    </div>
    
    Código:
    var app = angular.module('app', []);
    
    var promesa = new Promise(
       function(resolve, reject) {
         if (true) {
           var exito = {a: true}
           resolve(exito);
        } else {
           razon = new Error("error")
           reject(razon);
        }
      }
    )
        
    app.controller('xCtrl', function($scope) {
       $scope.email = "a@mail.com";
     
       function cambia_email() {
         $scope.email="b@mail.com";
         console.log($scope.email);
      }
     
      var llamada_a_promesa = function () {
        promesa.then(function(exito) {
            cambia_email();
        }).catch(function (error) {
          console.log(error);
        });
     }
     llamada_a_promesa();
    });
    
    Recomendacion o revisas como funciona bindings en js (this), o cambia la forma de llamadas de las funciones de la api de google sin usar promesas.

    edit: Si el $scope lo ves dentro de la funcion donde cambias un valor " console.log ($scope)" puedes forzar el refresh del scope sobre el dom con "$scope.$apply();" en tu caso seria :
    Código:
    $scope.email = profile.getEmail();
    $scope.$apply();
    console.log ....
    
     
  3. hioko

    hioko Miembro maestro

    Registro:
    20 Oct 2014
    Mensajes:
    891
    Likes:
    49
    Temas:
    102
    Si con el apply ya me imprime la data, pero es la forma correcta de poder hacerlo ? o utilizando this es la mejor?
     
  4. gnox

    gnox Miembro de bronce

    Registro:
    3 Ene 2013
    Mensajes:
    2,247
    Likes:
    883
    Temas:
    75
    Si tienes tiempo de leer como usar this, ve por this, sino si con apply no te afecta en nada sigue con otras cosas ..
     
  5. G_Pisfato

    G_Pisfato Miembro maestro

    Registro:
    15 Nov 2015
    Mensajes:
    666
    Likes:
    80
    Temas:
    5
    Aprovechando esto, podrían indicarme si hay alguna ventaja usando esto a diferencia de usar Javascript "normal".
    HTML:
    <h1 id="correo"></h1>
    PHP:
    document.getElementById("correo").appendChild(document.createTextNode("gp@peruhardware.net"))
     
  6. gnox

    gnox Miembro de bronce

    Registro:
    3 Ene 2013
    Mensajes:
    2,247
    Likes:
    883
    Temas:
    75
    Eso es javascript normal, solo estas usando un objeto del dom "document" y sus funciones. Obviamente solo va a funcionar donde exista ese objeto (navegadores).

    o te refieres a "esto" = angular ??
     
  7. G_Pisfato

    G_Pisfato Miembro maestro

    Registro:
    15 Nov 2015
    Mensajes:
    666
    Likes:
    80
    Temas:
    5
    Sí, con "esto" me estaba refiriendo al Angularjs.
    <h1>{{email}}</h1>
    contra
    <h1 id="correo"></h1>
    ¿Alguna ventaja de usar el Angularjs?
     
  8. gnox

    gnox Miembro de bronce

    Registro:
    3 Ene 2013
    Mensajes:
    2,247
    Likes:
    883
    Temas:
    75
    Si estas usando ese framework te ahorra el manejo de "state", sobre todo el html visualizado, imagina que tienes 40 variables, estructuras maestro/detalle ..

    con js
    document.getElementById("id1).value= o append etc....
    document.getElementById("id2").
    document.getElementById("id3").
    document.getElementById("id4").
    document.getElementById("id5").
    .....

    con jquery
    $('#id1').value =....
    $('#id2').value =....
    ....

    con angular, ya llenaste la estructura/variable por ejemplo si lo traes via ajax, y sola se refrezca en el dom con {{variable}}..
     
  9. G_Pisfato

    G_Pisfato Miembro maestro

    Registro:
    15 Nov 2015
    Mensajes:
    666
    Likes:
    80
    Temas:
    5
    Ah, eso era. Gracias.
    Entonces personalmente no creo que valga la pena su uso.