2016-05-05 2 views
0

Я использую angularjs для заполнения группы входов внутри формы.ввод текста с «ngModel» показывает его значение только после дефокусировки

Для заполнения этих входов я использую данные json, но он работает, однако, входы не отображают/отображают значения до тех пор, пока я не выберу вход, а затем не щелкните на любом другом месте страницы (расфокусировать).

это мой код (JavaScript/angularjs):

var app = angular.module('myApp', []); 
    app.controller('registerController', function($scope,$timeout,connectWS) { 
     $scope.start = function(){ 
      connectWS.getPerson(2,function(response){ 
       var data = JSON.parse(response.response.result.result); //<----JSON data 
       $scope.register=data; //<-----value assignation 
      }); 
     }; 
    }); 

app.factory('connectWS', function($http){ 
     return { 
      getPerson: function(idVal,callback){ 
       var formData = '{'+ 
        '"data": {'+ 
         '"id":"'+idVal+'"'+ 
        '}'+ 
       '}'; 

       var request = { 
        'function': 'getdata', 
        'parameters' : formData 
       }; 

       var op = gapi.client.request({ 
        'root': 'https://script.googleapis.com', 
        'path': 'v1/scripts/' + SCRIPT_ID + ':run', 
        'method': 'POST', 
        'body': request 
       }); 

       op.execute(callback); 
      } 
     }; 

... 


... 

function checkAuth() { 
     gapi.auth.authorize({ 
      'client_id': CLIENT_ID, 
      'scope': SCOPES, 
      'immediate': true 
     }, function(authResult){ 
      var scope = angular.element(document.getElementById("registerEditionDiv")).scope(); 
      scope.$apply(function() { 
       scope.start(); 
      }); 
     }); 
    } 

код запуска после этого:

<script src="https://apis.google.com/js/client.js?onload=checkAuth"></script> 

это мой код (HTML/angularjs):

<div class="regiRow"><p>Nombre:</p> <input type="text" id="name" ng-model="register.name"/></div> 
          <div class="regiRow"><p>Fecha de nacimiento:</p> <input type="text" id="birthdate" ng-model="register.birthdate"/></div> 
+0

вы можете поделиться определением функции connectWS.getPerson? Я хотел бы проверить это в jsfidle. И вы называете функцию $ scope.start? –

+0

Hola: Пожалуйста, создайте jsfiddle, я не вижу ничего плохого в вашем коде. – pdorgambide

+0

Возможно, проблема в том, что он определяет $ scope.start как функцию, но не называет его anywere внутри кода. Он должен быть $ scope.start = connectWS.getPerson (.....); –

ответ

0

по той причине, что я не знаю прямо сейчас, проблема решена, добавив «$ scope. $ Digest();» в функции «$ scope.start». что-то вроде этого:

$scope.start = function(){ 
      connectWS.getPerson(2,function(response){ 
       var data = JSON.parse(response.response.result.result); //<----JSON data 
       $scope.register=data; //<-----value assignation 
       $scope.$digest(); //<------Magic 
      }); 
     }; 

я действительно не знаю, почему, я гость, может быть, потому, что функция вызывается с «$ объема $ применяется (функция())», но я не уверен. Я все еще нуб со всем, что касается углового.

+1

$ scope. $ Digest() - внутренняя функция, используемая угловым способом для обновления представления модели и наоборот. $ scope. $ apply() выполняет функцию, а затем автоматически вызывает $ digest(). Я думаю, что ваша проблема заключается в том, что ваш обратный вызов выполняется асинхронно и поэтому находится за пределами цикла $ apply(). Попробуйте переместить ваш $ apply с начала() туда, где вы сохраняете данные в $ scope.register. –

+0

@MattW Я сделал вашу рекомендацию, и она работает. часть, где я присваиваю значения, окружена $ scope. $ apply и я удалил $ scope. $ digest из скрипта. Я думаю, это лучшее решение, потому что я удалил ненужный код. – ViROscar

+0

Рад это услышать. Я бы исследовал, как Angular watches objects - есть несколько методов, которые он может использовать. Я думаю, что это, вероятно, краевой случай, когда Angular выбирает неправильный метод, основанный на вашем методе ng-model. Вы также можете поэкспериментировать с $ scope. $ Watch или $ watchCollection вместо $ digest, поскольку это может быть быстрее. –