5

Verileri denetleyicideki bir nesneden görülebilen ng modeline yerleştiremiyorum.Köşeli - Denetleyicideki nesneden ng-Modeline veri alın

view1: Ben View2 bir düğmeyi tıkladığınızda, bir işlev (fonksiyon 'test' demek) ateşler

<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"> 

.

View2

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

KONTROL:

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 
    } 
}); 

DÜZENLEME: Eğer yardımcı olur herkes, ben de kumandanın beyanı göstermeye çalıştık. VIEW2'deki Profil düğmesine tıkladığımda, VIEW1'i verilerle doldurmak için nasıl yapabilirim?

+2

"Ng-controller" bildirimi ve kontrol cihazınızın geri kalanı size bildirir misiniz? –

+0

Hey @LenilsondeCastro tüm denetleyici çok büyük, ben sadece gerekli düşündüğüm parçaları verdim. Olsa da, kodu soyut ve ben de bildirimi vereyim .. –

+0

Hey @LenilsondeCastro ... Düzenleyici ve denetleyici ilan etti. –

cevap

0

plunker:

Working example

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> 

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; 
}); 

Öneriler:

  1. düzgün biçim kodu soran Lütfen sorular.
  2. İyi uygulama olarak bir stil kılavuzu kullanın. İyi bir başlangıç ​​noktası, tüm kontrol cihazınız bu mu? John Papa's Angular Style Guide
İlgili konular