Undefinierter Bereich in Angujar JS Formularfehler

Ich habe Probleme beim Binden von Formulardaten (die vollständig sind) an meinen Controller. Unten ist mein Code:Undefinierter Bereich in Angujar JS Formularfehler

<form name="form_foto" novalidate> 
     <div class="form-group"> 
      <label>URL de la foto: </label> 
      <!-- 
      <input type="text" required class="form-control" placeholder="http://ejemplo.com/foto.jpg"> 
      --> 
      <input type="text" required class="form-control" placeholder="http://ejemplo.com/foto.jpg" data-ng-model="mifoto.foto" name="foto"> 
     </div> 
     <div class="form-group"> 
      <label>Lugar: </label> 
      <input type="text" required class="form-control" placeholder="Lugar de ejemplo" data-ng-model="mifoto.lugar" name="lugar"> 
     </div> 
     <div class="form-group"> 
      <label>Año: </label>   
      <input type="text" required class="form-control" placeholder="2016" data-ng-model="mifoto.anio" name="anio"> 
     </div> 
     <!-- 
     <button class="btn btn-default">Guardar Foto</button> 
     --> 
     <button class="btn btn-default" data-ng-disabled="datosNoValidos()" data-ng-click="guardarFoto()">Guardar Foto</button> 
    </form>

guardarFoto Code Funktion:

$scope.guardarFoto = function(){   

     alert($scope.mifoto); //comes out undefined 

     $scope.misFotos.push($scope.mifoto); 
     delete $scope.mifoto;  

    }

Jede Hilfe wird sehr geschätzt. Vielen Dank!

Quelle

2016-06-30 Juan M

Warum ist das ** data-ng-model = "mifoto.foto" ** statt ** ng-model = "mifoto.foto" **? – Anson

@Anson Das ist wegen der Unterstützung von HTML5! –

Sinn machen. Vielen Dank. @ MeTe-30 – Anson

Initialisieren Sie einfach $scope.mifoto = {}.
prüfen diese anschauliches Beispiel:

angular.module('app', []) 
 
    .controller('ctrl', ['$scope', 
 
    function($scope) { 
 
     $scope.misFotos = []; 
 
     $scope.mifoto = {}; 
 

 
     $scope.guardarFoto = function() { 
 

 
     alert($scope.mifoto); //comes out undefined 
 

 
     $scope.misFotos.push($scope.mifoto); 
 
     delete $scope.mifoto; 
 

 
     } 
 
    } 
 
    ])

<!DOCTYPE html> 
 
<html ng-app="app"> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<body ng-controller="ctrl"> 
 
    <form name="form_foto" novalidate> 
 
    <div class="form-group"> 
 
     <label>URL de la foto:</label> 
 
     <!-- 
 
      <input type="text" required class="form-control" placeholder="http://ejemplo.com/foto.jpg"> 
 
      --> 
 
     <input type="text" required class="form-control" placeholder="http://ejemplo.com/foto.jpg" data-ng-model="mifoto.foto" name="foto"> 
 
    </div> 
 
    <div class="form-group"> 
 
     <label>Lugar:</label> 
 
     <input type="text" required class="form-control" placeholder="Lugar de ejemplo" data-ng-model="mifoto.lugar" name="lugar"> 
 
    </div> 
 
    <div class="form-group"> 
 
     <label>Año:</label> 
 
     <input type="text" required class="form-control" placeholder="2016" data-ng-model="mifoto.anio" name="anio"> 
 
    </div> 
 
    <!-- 
 
     <button class="btn btn-default">Guardar Foto</button> 
 
     --> 
 
    <button class="btn btn-default" data-ng-disabled="datosNoValidos()" data-ng-click="guardarFoto()">Guardar Foto</button> 
 
    </form> 
 
</body> 
 

 
</html>

Quelle

2016-06-30 00:49:40

Ich habe versucht, Ihr Code-Snippet, aber die Warnung druckt [Object-Objekt], als Ergebnis der $ scope.mifoto = {} Initialisierung, nehme ich an –

@JuanM Alert() kann nicht zeigen Sie Objekt Inhalt dude !. try console.log() –

Ich habe gerade versucht, einen Beispielwert von allem zu sehen, was den Controller erreicht. Zu diesem Zweck kann man beispielsweise alert ($ scope.mifoto.lugar) machen. console.log ist offensichtlich auch wichtig. Markieren Sie dies als die richtige Antwort. Vielen dank für Deine Hilfe! –

initialisieren mifoto außerhalb ur Funktion.

$scope.mifoto = {};

Quelle

2016-06-30 00:55:55 Wcan

Undefinierter Bereich in Angujar JS Formularfehler

Antwort

Verwandte Themen