Angolare: acquisizione dei dati in ng-Model dall'oggetto nel controller

Non riesco a mettere i dati in ng-model in vista da un oggetto nel controller.Angolare: acquisizione dei dati in ng-Model dall'oggetto nel controller

view1:

<input type="text" class="user-input" name="profile.firstname" ng-model="profile.firstname" ng-minlength="2" required pattern=".{2,}" placeholder="E.g. Anvika" title="Please enter atleast 2 characters">

Quando fa clic su un pulsante nel VIEW2, spara una funzione (dire 'test' di funzione).

<input type="submit" ng-click="register.test()" ui-sref="doctorRegister" value="Profile">

CONTROLLER:

var app = angular.module('app'); 
app.controller('registerController', ['$scope', 'tempDataStorageService', function ($scope, tempDataStorageService) { 


var register = this; 
register.doctor = {}; 
register.test = function() { 
    register.refreshProfile = tempDataStorageService.get(register.doctor.profile); 
    //console.log(register.refreshProfile); 
    var a = register.refreshProfile.firstname; 
    console.log(a);  
} 
}

TempDataStorageService:

var app = angular.module('app'); 
app.factory('tempDataStorageService', function() { 
    var savedData = {}; 
    function set(data) { 
     savedData = data; 
    } 
    function get() { 
     return savedData; 
    } 

    return { 
     set: set, 
     get: get 
    } 
});

EDIT: ho cercato di mostrare la dichiarazione del controllore pure, se questo aiuta. Come posso fare in modo che quando faccio clic sul pulsante Profilo su VISTA2, compaia VIEW1 con i dati?

fonte

2016-01-21 Sarthak Batra

Questo è l'intero controller? Potresti fornire la dichiarazione 'ng-controller' e il resto del controller? –

Hey @LenilsondeCastro l'intero controller è enorme, ti ho appena dato le parti che ritenevo necessarie. Però, fammi riassumere il codice e darti anche la dichiarazione .. –

Hey @LenilsondeCastro ... Modificato e dichiarato il controller. –

Il plunker:

Working example

il codice HTML:

<!DOCTYPE html> 
<html ng-app="plunker"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css" /> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script> 
    <script src="app.js"></script> 
    </head> 

    <body ng-controller="MainCtrl as mainCtrl"> 

    <form> 
     <h2 class="text-primary">Get data into ng-Model from object in controller</h2> 
     <hr> 
     <div class="form-group"> 
     <h3 ng-class="!mainCtrl.firstName? 'text-danger' : 'text-success'">Enter Name</h3> 
     <input type="text" class="form-control" ng-model="mainCtrl.firstName" placeholder="E.g. Anvika"> 
     </div> 


     <hr> 
     <h3 class="text-info">This is what you are typing: {{mainCtrl.firstName}}</h3> 
     <button type="button" class="btn btn-success" ng-click="mainCtrl.test()">Save Name</button> 
    </form> 

    <hr> 
    <h3 class="text-info">This is what is stored</h3> 
    <h4>Doctor first name: {{mainCtrl.storedData.doctorFirstName}}</h4> 
    </body> 

</html>

Il JS:

var app = angular.module('plunker', []); 

app.controller('MainCtrl', ['tempDataStorageService', function(tempDataStorageService) { 

    var register = this; 

    register.firstName = ""; 

    register.storedData = tempDataStorageService; 

    register.test = function() { 
     tempDataStorageService.setName(register.firstName); 
    } 

}]); 


app.factory('tempDataStorageService', function() { 
    // The service object 
    var profile = {}; 

    profile.doctorFirstName = "No doctor data stored"; 

    //The functions 

    profile.setName = function(data) { 
     profile.doctorFirstName = data; 
    } 

    profile.getName = function() { 
     return profile.doctorFirstName; 
    } 

    // return the service object 
    return profile; 
});

Raccomandazioni:

prega correttamente codice di formato quando si fanno domande.
Come buona pratica utilizzare una guida di stile. Un buon punto di partenza è John Papa's Angular Style Guide

fonte

2016-02-03 17:01:32

Angolare: acquisizione dei dati in ng-Model dall'oggetto nel controller

risposta

Problemi correlati