簡體   English   中英

角提交表格不起作用

[英]Angular submission form not working

我正在嘗試提交此表格,但沒有任何反應。 想法是向Google地圖添加新的標記。 我有一個數組,我在其中放置了所有創建的標記。 我正在使用ng-submit,還有一個按鈕類型Submit,但是當按下按鈕時,瀏覽器上沒有任何反應。

HTML

    <form ng-submit="agregarMarcador()">
    <label>Nombre de la ubicacion</label>
    <input class="form-control-md-12" type="text" ng-model="nombreMarcador" name="nombreMarcador">

    <label>Latitud</label>
    <input class="form-control-md-12" type="text" ng-model="latitudMarcador" name="latitudMarcador">

    <label>Longitud</label>
    <input class="form-control-md-12" type="text" ng-model="longitudMarcador" name="longitudMarcador">

    <label>Arrastrable</label>
    <select class="form-control-md-12" ng-model="marcadorArrastrable" name="marcadorArrastrable">
        <option value="si">Si</option>
        <option value="no">No</option>
    </select>
    <button type="submit" class="btn btn-primary">Save</button>
</form>

JS

agregarMarcador(){

console.log("Agregando marcador");

if(this.marcadorArrastrable == "si"){

        var esArrastrable = true;

}else{

        var esArrastrable = false;
}

var nuevoMarcador = {

    nombre : this.nombreMarcador,
    lati: parseFloat(this.latitudMarcador),
    lngi: parseFloat(this.longitudMarcador),
    drag : esArrastrable 
}

this.markers.push(nuevoMarcador);

}

使用以下代碼,您的應用應該可以使用!

視圖

<div ng-app="MarcadorApp" ng-controller="MarcadorCtrl">
  <form ng-submit="agregarMarcador()">
    <!-- Nombre de la ubicación -->
    <label>Nombre de la ubicación</label>
    <input class="form-control-md-12" type="text" ng-model="nombreMarcador" name="nombreMarcador">
        <!-- Latitud -->
    <label>Latitud</label>
    <input class="form-control-md-12" type="text" ng-model="latitudMarcador" name="latitudMarcador">
    <!-- Longitud -->
    <label>Longitud</label>
    <input class="form-control-md-12" type="text" ng-model="longitudMarcador" name="longitudMarcador">
    <!-- Arrastrable -->
    <label>Arrastrable</label>
    <select class="form-control-md-12" ng-model="marcadorArrastrable" name="marcadorArrastrable">
        <option value="true">Si</option>
        <option value="false">No</option>
    </select>
    <!-- Guardar Marcador -->
    <button type="submit" class="btn btn-primary">Save</button>
  </form>
</div>

調節器

'use strict';
var app = angular.module('MarcadorApp', []);
app.controller('MarcadorCtrl', ['$scope', function($scope) {
    $scope.agregarMarcador = function() {
        var nuevoMarcador = {
            nombre: this.nombreMarcador,
            lati: parseFloat(this.latitudMarcador),
            lngi: parseFloat(this.longitudMarcador),
            drag: this.marcadorArrastrable
        };
        console.log(nuevoMarcador);
    };
}]);

繼續搖擺!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM